1
00:00:00,000 --> 00:00:06,986

2
00:00:06,986 --> 00:00:10,450
>> DAVEN Farnham: आज, मैं जा रहा हूँ
HTML के बारे में एक छोटा सा बात करते हैं,

3
00:00:10,450 --> 00:00:12,330
हाइपरटेक्स्ट मार्कअप लैंग्वेज.

4
00:00:12,330 --> 00:00:14,450
आप इन दिनों हर जगह एचटीएमएल देखें.

5
00:00:14,450 --> 00:00:17,190
वास्तव में, आप यह देख रहे हैं
एक ब्राउज़र में वीडियो, आप कर रहे हैं

6
00:00:17,190 --> 00:00:19,120
अब ठीक एचटीएमएल देखकर.

7
00:00:19,120 --> 00:00:22,760
HTML एक प्रोग्रामिंग भाषा नहीं है,
दरअसल, यह द्वारा इस्तेमाल मार्कअप भाषा है

8
00:00:22,760 --> 00:00:25,460
पृष्ठों को प्रस्तुत करने के लिए वेब ब्राउज़र
इंटरनेट पर.

9
00:00:25,460 --> 00:00:30,410
>> तो आप लिख रहा है बिल्कुल कैसे पूछ सकते हैं
अलग HTML में एक वेब पेज

10
00:00:30,410 --> 00:00:33,574
एक प्रोग्रामिंग में एक प्रोग्राम लिखने से
सी की तरह भाषा?

11
00:00:33,574 --> 00:00:38,010
खैर, सी बहुत सख्त साथ एक भाषा है
होने की जरूरत है कि वाक्य नियम

12
00:00:38,010 --> 00:00:39,880
यह चलाने से पहले संकलित.

13
00:00:39,880 --> 00:00:43,070
क्या तुमने कभी एक शामिल करने के लिए भूल गए हैं
में एक बयान के अंत में अर्धविराम

14
00:00:43,070 --> 00:00:46,660
अपने सी कोड, आपको मैं बात कर रहा हूँ
सख्त वाक्यविन्यास के संबंध में के बारे में.

15
00:00:46,660 --> 00:00:50,360
>> वेब ब्राउज़रों हालांकि, थोड़ा और अधिक कर रहे हैं
यह HTML के लिए आता है क्षमा.

16
00:00:50,360 --> 00:00:53,860
अपने HTML वाक्य रचना नहीं है यहां तक ​​कि अगर
सही, अपने पृष्ठ अभी भी हो सकता है

17
00:00:53,860 --> 00:00:57,150
एक ब्राउज़र द्वारा प्रदर्शित है, लेकिन यह हो सकता है
आप के रूप में इरादा नहीं लग रही.

18
00:00:57,150 --> 00:00:59,640
तो यह करने के लिए सबसे अच्छा हमेशा
नियमों का पालन करें.

19
00:00:59,640 --> 00:01:01,990
एक अंतर्ज्ञान प्राप्त करने के लिए सबसे अच्छा तरीका
कुछ काम करने के बारे में कैसे

20
00:01:01,990 --> 00:01:03,300
एक उदाहरण के माध्यम से जाना.

21
00:01:03,300 --> 00:01:07,360
>> तो क्या हम यहाँ है एक बुनियादी है
एक वेब पेज के लिए खाका.

22
00:01:07,360 --> 00:01:10,690
तुम्हें शायद बहुत सारी बातें गौर
angled कोष्ठक के बीच में.

23
00:01:10,690 --> 00:01:12,900
खैर, वह सिर्फ टैग कर रहे हैं.

24
00:01:12,900 --> 00:01:15,810
टैग मूल रूप से वेब ब्राउज़र को सूचित
कि, अरे, कुछ

25
00:01:15,810 --> 00:01:17,150
आपके रास्ते में आ रही है.

26
00:01:17,150 --> 00:01:20,770
आप को खोलने के लिए जब भी लेकिन याद रखें, एक
टैग, तुम अपने आप को एक बार इसे बंद करने की जरूरत है

27
00:01:20,770 --> 00:01:21,750
इसे का उपयोग किया.

28
00:01:21,750 --> 00:01:24,690
>> तो उदाहरण के लिए, मैं एक भाग को खोल
खुला के साथ कोड की

29
00:01:24,690 --> 00:01:26,960
ब्रैकेट शरीर, बंद कोष्ठक.

30
00:01:26,960 --> 00:01:31,280
मैं तो अपने, इस मामले में, कुछ पाठ जोड़ें
पहला वेब पेज तो मैं गया था जब

31
00:01:31,280 --> 00:01:35,540
इस भाग को बन्द, मैं उपयोग लगभग एक
एक साथ इस समय को छोड़कर समान टैग

32
00:01:35,540 --> 00:01:37,660
आगे शरीर से पहले स्लेश.

33
00:01:37,660 --> 00:01:41,140
सामान्य में, यह आप कर रहे हैं प्रारूप है
आप खोल रहे हैं जब भी उपयोग करने के लिए जा रहा

34
00:01:41,140 --> 00:01:42,680
और टैग समापन.

35
00:01:42,680 --> 00:01:47,900
साथ में, एक खुली टैग और एक अंत टैग
एक तत्व कहा जाता है रचना.

36
00:01:47,900 --> 00:01:51,870
>> आप पहली पंक्ति को देखो, तुम हूँ
इसके बाद विस्मयादिबोधक बिंदु दिखाई

37
00:01:51,870 --> 00:01:53,350
टैग HTML.

38
00:01:53,350 --> 00:01:56,280
यह वास्तव में सिर्फ अपने ब्राउज़र कह रही है
फाइल एक वेब पेज है कि

39
00:01:56,280 --> 00:01:58,280
HTML में लिखा.

40
00:01:58,280 --> 00:02:01,970
एचटीएमएल टैग अनिवार्य रूप से कहते हैं,
यहाँ कुछ HTML आता है.

41
00:02:01,970 --> 00:02:04,950
तो फिर हम साथ एक सिर टैग
इसके अंदर एक शीर्षक टैग.

42
00:02:04,950 --> 00:02:09,430
आप के रूप में के बारे में सोच सकते हैं सिर टैग
के लिए आता है जिसमें एचटीएमएल कोड

43
00:02:09,430 --> 00:02:12,670
अपने वेब पेज के थोक
वास्तविक सामग्री.

44
00:02:12,670 --> 00:02:16,700
>> सामान्य में, आप का शीर्षक डाल अपने
यहाँ वेब पेज है, हालांकि कुछ कर रहे हैं

45
00:02:16,700 --> 00:02:19,350
प्रदर्शित कर सकते हैं कि अन्य टैग
यहाँ के रूप में अच्छी तरह से.

46
00:02:19,350 --> 00:02:25,020
अगले अपने वेब पेज के शरीर, आता है
अपनी वेबसाइट के वास्तविक मांस और हड्डियों.

47
00:02:25,020 --> 00:02:28,910
हमारे उदाहरण में, हम सिर्फ एक सरल डाल दिया है
वाक्य, मेरा पहला वेबपेज,

48
00:02:28,910 --> 00:02:34,100
जो, हम अपनी साइट चलाते हैं, दिखेगा
इस तरह एक छोटे से कुछ.

49
00:02:34,100 --> 00:02:36,810
हमारे वेब पेज भी अजीब नहीं है,
लेकिन चिंता मत करो.

50
00:02:36,810 --> 00:02:39,210
हम इसे जल्द ही सजाना करेंगे.

51
00:02:39,210 --> 00:02:44,070
>> तो ऊपर एचटीएमएल, हम आपको एक बहुत ही देता हूँ
एक वेब पेज के लिए बुनियादी टेम्पलेट,

52
00:02:44,070 --> 00:02:46,310
फैंसी कुछ नहीं, सिर्फ नंगे हड्डियों.

53
00:02:46,310 --> 00:02:49,160
लेकिन मैं एक वेब पेज बना रहा हूँ अगर,
क्या मैं एक जोड़ना चाहते हैं

54
00:02:49,160 --> 00:02:50,760
अपने आप को, कहते हैं, की तस्वीर है?

55
00:02:50,760 --> 00:02:52,760
खैर, मैं ऐसा कर सकते हैं.

56
00:02:52,760 --> 00:02:55,460
तरीके के एक जोड़े के लिए कर रहे हैं
आपकी साइट के लिए छवियों को जोड़ने.

57
00:02:55,460 --> 00:02:59,780
छवि के रूप में एक ही फ़ोल्डर में है, तो
अपने HTML फ़ाइल, आप को लिंक कर सकते हैं

58
00:02:59,780 --> 00:03:01,950
इस तरह पथ के माध्यम से छवि.

59
00:03:01,950 --> 00:03:05,910
>> तुम्हारा पीछा एक छवि टैग के साथ खुला
द्वारा में Alt विशेषता में

60
00:03:05,910 --> 00:03:07,240
छवि का स्रोत.

61
00:03:07,240 --> 00:03:12,030
Alt विशेषता के मूल्य है, बस कुछ
मामले में वैकल्पिक पाठ एक उपयोगकर्ता नहीं कर सकते

62
00:03:12,030 --> 00:03:13,580
छवि देखते हैं.

63
00:03:13,580 --> 00:03:19,680
वैकल्पिक रूप से, आप भी करने के लिए लिंक कर सकते हैं
इस तरह से एक पूर्ण यूआरएल के माध्यम से छवियों,.

64
00:03:19,680 --> 00:03:24,180
अब, कि वेबसाइट वास्तव में मौजूद नहीं है,
लेकिन की एक तस्वीर अगर वहाँ थे

65
00:03:24,180 --> 00:03:27,760
उस पते पर मुझे, मैं इस्तेमाल कर सकते हैं
शामिल करने के लिए स्रोत यूआरएल

66
00:03:27,760 --> 00:03:29,930
अपनी वेबसाइट पर अपनी छवि.

67
00:03:29,930 --> 00:03:35,590
किसी भी तरह से, आप एक बहुत के साथ खत्म
सुंदर वेबसाइट, कुछ इस तरह.

68
00:03:35,590 --> 00:03:39,730
>> वैसे, यह बहुत अच्छा है, लेकिन मैं एक तरह
के रूप में अच्छी तरह से यहाँ कुछ पाठ करना चाहता हूँ.

69
00:03:39,730 --> 00:03:43,020
तो चलो बस कुछ जोड़ दें
ऊपर सुपर सरल

70
00:03:43,020 --> 00:03:45,210
हैडर छवि की तरह,.

71
00:03:45,210 --> 00:03:50,830
मैं अब तक क्या किया है सभी शीर्ष लेख का उपयोग है
टैग, H1, और एक पंक्ति विराम टैग, बीआर.

72
00:03:50,830 --> 00:03:54,900
हैडर टैग फ़ॉन्ट एक छोटा बनाता है
थोड़ा बड़ा और अधिक प्रमुख.

73
00:03:54,900 --> 00:03:58,930
अन्य पर पंक्ति विराम टैग,
हाथ, शांत की तरह है.

74
00:03:58,930 --> 00:04:03,720
अधिकांश अन्य टैग के विपरीत, तुम नहीं है
एक खुलने और बंद तोड़ने के टैग, बस

75
00:04:03,720 --> 00:04:05,120
एक ऊपर दिखाए गए.

76
00:04:05,120 --> 00:04:10,420
ब्रेक के कोई सामग्री नहीं है क्योंकि यह है
और, इसलिए एक खाली तत्व है.

77
00:04:10,420 --> 00:04:14,940
>> इस तरह से खाली तत्वों, आप खोल सकते हैं
और बस से एक साथ करीब

78
00:04:14,940 --> 00:04:20,420
पर आगे स्लैश सहित
प्रारंभिक घोषणा के अंत.

79
00:04:20,420 --> 00:04:24,390
तो अब मेरी वेबसाइट थोड़ा सा दिखता है
कुछ इस तरह.

80
00:04:24,390 --> 00:04:27,410
बेहतर है, लेकिन यह एक तरह से महसूस करता है
एक मरा हुआ अंत की तरह.

81
00:04:27,410 --> 00:04:30,850
एक तरफ कहीं और जाना नहीं है
इस मुख्य पृष्ठ से.

82
00:04:30,850 --> 00:04:33,075
ठीक है, चलो द्वारा तय है कि
एक कड़ी भी शामिल है.

83
00:04:33,075 --> 00:04:36,860
>> क्या मैं यहाँ क्या करने जा रहा हूँ एक का उपयोग है
एक से चिह्नित गुण और बनाने

84
00:04:36,860 --> 00:04:40,780
छवि के लिए एक कड़ी है, चलो, CS50 टीवी कहते हैं.

85
00:04:40,780 --> 00:04:44,460
इस तरह, किसी ने मुझे पर क्लिक करने पर,
अपने ब्राउज़र के लिए निर्देशित किया जाएगा

86
00:04:44,460 --> 00:04:47,810
एक और, शायद अधिक
उपयोगी, वेब पेज.

87
00:04:47,810 --> 00:04:51,040
मैं के आकार को कम करने के लिए लिया है
हमारे वेब पेज है, क्योंकि एक सा पाठ

88
00:04:51,040 --> 00:04:52,470
अधिक उन्नत हो रही है.

89
00:04:52,470 --> 00:04:54,590
लेकिन उम्मीद है, यह अभी भी स्पष्ट है.

90
00:04:54,590 --> 00:04:59,460
मेरी वेबसाइट बिल्कुल वैसा ही दिखता है ही
अब, मैं तस्वीर पर क्लिक करें जब भी,

91
00:04:59,460 --> 00:05:04,410
मेरे ब्राउज़र एक और खुल जाएगा
CS50.tv वेब पेज के लिए टैब.

92
00:05:04,410 --> 00:05:08,970
>> अन्त में, की मैं शैली के लिए जा रहा हूँ हम कहते हैं
इस वेबसाइट बाद में सीएसएस का उपयोग कर.

93
00:05:08,970 --> 00:05:11,730
सीएसएस एक के रूप में जाना जाता है
व्यापक स्टाइल शीट.

94
00:05:11,730 --> 00:05:15,230
और यह मूल रूप से एक कुशल प्रदान करता है
संपादित करने के लिए रास्ता और शैली

95
00:05:15,230 --> 00:05:16,910
कोड की समान ब्लॉकों.

96
00:05:16,910 --> 00:05:21,290
मैं अपने HTML में आयोजन शुरू करना चाहते हैं
यह आसान है पर बाद में शैली के लिए बनाते हैं.

97
00:05:21,290 --> 00:05:26,900
यहाँ, मैं दो अलग अलग प्रकार के सेट अप
मेरे कोड व्यवस्थित करने में मदद करने के लिए पहचानकर्ता.

98
00:05:26,900 --> 00:05:31,170
मैं एक के अंदर आईडी गुण का उपयोग किया है
विभाजन, या div टैग, और मैं एक का उपयोग किया है

99
00:05:31,170 --> 00:05:34,120
क्लास के अंदर विशेषता
एक और div टैग.

100
00:05:34,120 --> 00:05:37,190
>> आईडी और कक्षा गुण
इसी प्रकार काम करते हैं.

101
00:05:37,190 --> 00:05:41,210
फर्क सिर्फ इतना है कि आप केवल हो सकता है
एक तत्व, विशिष्ट आईडी, लेकिन

102
00:05:41,210 --> 00:05:43,600
तत्वों की किसी भी संख्या
एक वर्ग साझा कर सकते हैं.

103
00:05:43,600 --> 00:05:47,690
तो उदाहरण के लिए, मैं वर्ग का उपयोग कर सकते हैं
छवि कई बार, लेकिन मैं नहीं कर सकता

104
00:05:47,690 --> 00:05:50,533
एक और विभाजन बना
आईडी के साथ शीर्ष.

105
00:05:50,533 --> 00:05:54,750
मैं सीएसएस में नहीं गए हैं,
आमतौर पर इस्तेमाल किया एक और भाषा

106
00:05:54,750 --> 00:05:59,700
एचटीएमएल के साथ, एक बार मैं स्टाइल शुरू
सीएसएस के साथ अपने कोड, मैं इन का उपयोग कर सकते हैं

107
00:05:59,700 --> 00:06:03,730
प्रभावित करने के लिए संगठनात्मक गुण
अपने वेब पेज के सौंदर्यशास्त्र.

108
00:06:03,730 --> 00:06:07,600
>> प्रभाग शीर्ष के भीतर सब कुछ
इसी तरह की शैली या किसी भी होगा

109
00:06:07,600 --> 00:06:12,010
में HTML मैं समूह के अन्य समूह
वर्ग छवि एक समान दिखाई हिस्सा होगा.

110
00:06:12,010 --> 00:06:15,700
इस संपादित करने की कोशिश की तुलना में आसान है
और शैली छवियों या के ब्लॉक

111
00:06:15,700 --> 00:06:17,690
अलग - अलग पाठ.

112
00:06:17,690 --> 00:06:21,480
>> तो हम कैसे की मूल बातें खत्म हो गया था
HTML के साथ एक वेब पेज बनाने के लिए.

113
00:06:21,480 --> 00:06:25,280
एचटीएमएल भी अन्य सुविधाओं का एक गुच्छा है
कि अन्य भाषाओं के साथ रखा जब

114
00:06:25,280 --> 00:06:29,220
सीएसएस और जावास्क्रिप्ट की तरह कर सकते हैं, वास्तव में
पन्ने बाहर खड़े करते हैं.

115
00:06:29,220 --> 00:06:32,960
साथ आराम पाने के लिए सबसे अच्छा तरीका
एचटीएमएल, इसके साथ चारों ओर सिर्फ गड़बड़ करने के लिए है

116
00:06:32,960 --> 00:06:35,120
क्या काम करता है, और क्या नहीं देखते हैं.

117
00:06:35,120 --> 00:06:36,570
>> मेरा नाम Daven Farnham है.

118
00:06:36,570 --> 00:06:37,820
इस CS50 है.

119
00:06:37,820 --> 00:06:40,640

120
00:06:40,640 --> 00:06:45,690
>> तो उदाहरण के लिए, मैं उपयोग कर सकते हैं
वर्ग छवि -

121
00:06:45,690 --> 00:06:48,028
नहीं, तो कई गुण होते हैं.

122
00:06:48,028 --> 00:06:52,500

123
00:06:52,500 --> 00:06:53,950
मेरा नाम Daven Farnham है.

124
00:06:53,950 --> 00:06:58,560
इस सीएस 650 है.

125
00:06:58,560 --> 00:06:59,810
मैं सीएसएस कहना चाहता हूँ.

126
00:06:59,810 --> 00:07:02,325

127
00:07:02,325 --> 00:07:03,575
इस सीएसएस है.

128
00:07:03,575 --> 00:07:05,408