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
شما نگاه کنید به HTML در همه جا این روز است.

5
00:00:14,450 --> 00:00:17,190
در واقع، اگر شما در حال مشاهده این
ویدئویی در یک مرورگر، شما

6
00:00:17,190 --> 00:00:19,120
دیدن HTML در حال حاضر.

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
از نوشتن یک برنامه در برنامه نویسی
زبان مانند C؟

11
00:00:33,574 --> 00:00:38,010
خوب، C یک زبان با بسیار سخت است
قوانین نحوی است که نیاز به

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
کد C خود را، شما می دانید آنچه من صحبت کردن در
در مورد در رابطه با ساختار نحوی دقیق.

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
شما احتمالا متوجه بسیاری از مسائل
در بین براکت زاویه دار.

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
>> بنابراین برای مثال، I باز کردن یک بخش
کد باز

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 غیر DOCTYPE.

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 اساسا می گوید،
در اینجا می آید برخی از HTML.

41
00:02:01,970 --> 00:02:04,950
سپس ما یک تگ سر با
تگ عنوان در داخل آن.

42
00:02:04,950 --> 00:02:09,430
برچسب سر شما می توانید از فکر می کنم به عنوان
شامل کد HTML است که می آید برای

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
>> بنابراین HTML فوق، ما به شما بسیار را
قالب عمومی برای یک صفحه وب،

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
متناوبا، شما همچنین می توانید به لینک
تصاویر از طریق یک URL کامل، مثل این.

64
00:03:19,680 --> 00:03:24,180
در حال حاضر، که وب سایت واقعا نمی وجود داشته باشد،
اما اگر یک عکس از وجود دارد

65
00:03:24,180 --> 00:03:27,760
من در آن آدرس، من می توانم با استفاده از
URL منبع شامل

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 TV.

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
>> در نهایت، اجازه دهید بگویم من قصد دارم به سبک
این وب سایت بعد با استفاده از CSS.

93
00:05:08,970 --> 00:05:11,730
CSS است آنچه که به عنوان شناخته شده
سبک آبشار ورق.

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
I صفت ID در داخل استفاده می شود
تقسیم و یا تگ div، و من استفاده می شود

99
00:05:31,170 --> 00:05:34,120
کلاس نسبت در داخل
یکی دیگر از تگ div.

100
00:05:34,120 --> 00:05:37,190
>> ID و کلاس صفات
کار به همین ترتیب.

101
00:05:37,190 --> 00:05:41,210
تنها تفاوت این است که شما فقط می توانید
یک عنصر، ID های خاص، اما

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
ایجاد تفرقه دیگر
با بالا ID.

105
00:05:50,533 --> 00:05:54,750
اگر چه من به CSS رفته نیست،
زبان دیگر معمولا استفاده می شود

106
00:05:54,750 --> 00:05:59,700
در کنار HTML، یک بار من شروع یک ظاهر طراحی شده
کد من با CSS، من می توانید از این استفاده کنید

107
00:05:59,700 --> 00:06:03,730
ویژگی های سازمانی نفوذ
زیبایی شناسی صفحه وب من است.

108
00:06:03,730 --> 00:06:07,600
>> همه چیز در بالای بخش
خواهد stylings مشابه و یا هر گونه دارند

109
00:06:07,600 --> 00:06:12,010
گروه دیگر از گروه I 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
HTML دارای یک دسته از ویژگی های دیگر بیش از حد
که هنگامی که با زبان های دیگر زوج

114
00:06:25,280 --> 00:06:29,220
مانند CSS و جاوا اسکریپت، واقعا می تواند در
صفحات ایستادگی کردن.

115
00:06:29,220 --> 00:06:32,960
بهترین راه برای دریافت راحت با
HTML فقط به یک ظرف غذا با آن در اطراف،

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
این CS 650 است.

125
00:06:58,560 --> 00:06:59,810
من می خواهم بگویم CSS.

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

127
00:07:02,325 --> 00:07:03,575
این CSS است.

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