DAVEN FARNHAM: امروز، من قصد دارم بحث کمی در مورد HTML، زبان نشانه گذاری ابرمتن. شما نگاه کنید به HTML در همه جا این روز است. در واقع، اگر شما در حال مشاهده این ویدئویی در یک مرورگر، شما دیدن HTML در حال حاضر. HTML یک زبان برنامه نویسی نیست، نه، آن را به یک زبان نشانه گذاری مورد استفاده است مرورگرهای وب برای رندر صفحات بر روی اینترنت. 

بنابراین شما ممکن است بپرسید، چگونه دقیقا در حال نوشتن یک صفحه وب در HTML های مختلف از نوشتن یک برنامه در برنامه نویسی زبان مانند C؟ خوب، C یک زبان با بسیار سخت است قوانین نحوی است که نیاز به وارد شده قبل از آن را می تواند اجرا شود. اگر تا به حال را فراموش کرده ام که شامل نقطه و ویرگول در پایان بیانیه ای در کد C خود را، شما می دانید آنچه من صحبت کردن در در مورد در رابطه با ساختار نحوی دقیق. 

مرورگرهای وب هر چند، یک کمی بیشتر بخشش که آن را به HTML می آید. حتی اگر HTML شما نحوی نمی درست است، صفحه شما هنوز هم ممکن است نمایش داده شده توسط یک مرورگر است، اما ممکن به نظر نمی آید که شما در نظر گرفته شده. بنابراین همیشه بهترین به قوانین دنبال کنید. بهترین راه برای دریافت شهود در مورد چگونه همه چیز کار این است که از طریق به مثال مراجعه. 

بنابراین آنچه که ما در اینجا یک پایه طرح برای یک صفحه وب. شما احتمالا متوجه بسیاری از مسائل در بین براکت زاویه دار. خوب، کسانی که فقط برچسب هستند. برچسب ها اساسا مرورگرهای وب اطلاع رسانی که، هی، چیزی در حال آمدن است راه خود را. به یاد داشته باشید هر چند، هر زمان که شما باز کردن یک برچسب، شما نیاز به آن نزدیک است یک بار شما انجام می شود با استفاده از آن. 

بنابراین برای مثال، I باز کردن یک بخش کد باز بدن براکت، براکت نزدیک است. من پس از اضافه کردن متن، در این مورد، من صفحه وب برای اولین بار پس از آن زمانی که من رفتم بستن این بخش، من با استفاده از تقریبا یک برچسب یکسان به جز این زمان با رو به جلو قبل از بدن بریده بریده. به طور کلی، این قالب شما می باشد رفتن به استفاده از هر زمان که شما در حال باز کردن و بسته شدن تگ ها. با هم، یک تگ باز و یک تگ پایانی نوشتن آنچه که یک عنصر نامیده می شود. 

اگر شما در خط اول نگاه کنید، نظر شما به علامت تعجب پس از دیدن HTML غیر DOCTYPE. این است که واقعا فقط به گفتن مرورگر شما که این فایل یک صفحه وب است نوشته شده در HTML. برچسب HTML اساسا می گوید، در اینجا می آید برخی از HTML. سپس ما یک تگ سر با تگ عنوان در داخل آن. برچسب سر شما می توانید از فکر می کنم به عنوان شامل کد HTML است که می آید برای بخش عمده ای از صفحه وب شما محتوای واقعی. 

به طور کلی، شما را به عنوان شما صفحه وب در اینجا، هر چند برخی وجود دارد تگ های دیگر است که می تواند به نظر می رسد در اینجا نیز هست. بعدی بدن صفحه وب شما می آید، گوشت واقعی و استخوان های وب سایت شما. در مثال ما، ما فقط قرار داده ساده جمله، صفحه وب اول من، که، اگر ما سایت ما را اجرا کنید، نگاه خواهد کرد چیزی کمی شبیه به این. صفحه وب ما این است که بیش از حد عجیب و غریب نیست، اما نگران نباشید. ما آن را به زودی صنوبر. 

بنابراین HTML فوق، ما به شما بسیار را قالب عمومی برای یک صفحه وب، علاقه داشتن به چیزی، فقط استخوان لخت. اما اگر من ایجاد یک صفحه وب، چه می شود اگر من می خواهم برای اضافه کردن یک تصویر، می گویند، خودم؟ خوب، من می تواند انجام دهد. یک زن و شوهر از راه های وجود دارد اضافه کردن تصاویر به سایت شما. اگر تصویر در همان پوشه است فایل HTML شما، شما می توانید به لینک تصویر از طریق مسیر. 

شما باز با برچسب تصویر به دنبال توسط در صفت Alt در منبع تصویر. ارزش صفت Alt است فقط برخی از متن جایگزین در مورد یک کاربر نمی تواند تصویر را ببینید. متناوبا، شما همچنین می توانید به لینک تصاویر از طریق یک URL کامل، مثل این. در حال حاضر، که وب سایت واقعا نمی وجود داشته باشد، اما اگر یک عکس از وجود دارد من در آن آدرس، من می توانم با استفاده از URL منبع شامل تصویر خود را در وب سایت من. در هر صورت، شما را تا پایان با بسیار وب سایت زیباتر، چیزی شبیه به این. 

خب، این خیلی داغ، اما من از نوع از می خواهید متن در اینجا نیز هست. بنابراین اجازه دهید تنها چیزی اضافه کنید فوق العاده ساده بالا تصویر، مثل هدر. همه من تا کنون انجام داده ام می باشد استفاده از هدر تگ H1، و یک خط برچسب، برزیلی. برچسب هدر می سازد که قلم کمی کمی بزرگ تر و برجسته تر. برچسب خط شکسته، از سوی دیگر دست، از نوع سرد است. بر خلاف بسیاری از تگ های دیگر، شما لازم نیست یک تگ باز و شکسته بسته شدن، فقط که در بالا نشان داده شده است. دلیل این است که شکست ندارد مطالب و یک عنصر خالی است بنابراین،. 

عناصر خالی مثل این، شما می توانید باز و نزدیک به طور همزمان به سادگی با از جمله اسلش در پایان اظهارنامه اولیه. بنابراین در حال حاضر وب سایت من به نظر می رسد کمی چیزی شبیه به این. بهتر است، اما آن نوع احساس مثل بن بست. در هیچ جای دیگری وجود دارد به کنار از این صفحه اصلی است. خوب، اجازه دهید در حل که توسط از جمله یک لینک. 

چه من قصد دارم برای انجام این کار اینجا این است که استفاده از ویژگی مشخص شده توسط و تصویر یک لینک به، اجازه دهید بگویم، CS50 TV. به این ترتیب، هر زمان که کسی کلیک بر روی من، مرورگر خود را به کارگردانی دیگر، احتمالا بیشتر مفید، صفحه وب. من تا به حال برای به حداقل رساندن اندازه متن کمی به دلیل صفحه وب ما گرفتن پیشرفته تر. اما امیدوارم، آن را هنوز هم روشن است. وب سایت من به نظر می رسد دقیقا همان تنها در حال حاضر، هر زمان که من بر روی تصویر کلیک کنید، مرورگر من باز خواهد شد تا دیگر تب برای صفحه وب CS50.tv. 

در نهایت، اجازه دهید بگویم من قصد دارم به سبک این وب سایت بعد با استفاده از CSS. CSS است آنچه که به عنوان شناخته شده سبک آبشار ورق. و آن را اساسا کارآمد را فراهم می کند راه برای ویرایش و سبک مشابه بلوک های کد. من می خواهم برای شروع سازماندهی HTML من به آن را آسان تر به سبک بعد. در اینجا، من راه اندازی دو نوع شناسه برای کمک به سازماندهی کد من. I صفت ID در داخل استفاده می شود تقسیم و یا تگ div، و من استفاده می شود کلاس نسبت در داخل یکی دیگر از تگ div. 

ID و کلاس صفات کار به همین ترتیب. تنها تفاوت این است که شما فقط می توانید یک عنصر، ID های خاص، اما هر تعداد از عناصر می توانید یک کلاس به اشتراک بگذارید. بنابراین برای مثال، من می توانم کلاس استفاده تصویر چند بار، اما نمی توانم ایجاد تفرقه دیگر با بالا ID. اگر چه من به CSS رفته نیست، زبان دیگر معمولا استفاده می شود در کنار HTML، یک بار من شروع یک ظاهر طراحی شده کد من با CSS، من می توانید از این استفاده کنید ویژگی های سازمانی نفوذ زیبایی شناسی صفحه وب من است. 

همه چیز در بالای بخش خواهد stylings مشابه و یا هر گونه دارند گروه دیگر از گروه I HTML به تصویر کلاس یک نگاه مشابه به اشتراک بگذارید. این خیلی ساده تر از تلاش برای ویرایش و تصاویر و یا بلوک از متن به صورت جداگانه. 

بنابراین ما بیش از اصول اولیه چگونه رفت به یک صفحه وب با HTML. HTML دارای یک دسته از ویژگی های دیگر بیش از حد که هنگامی که با زبان های دیگر زوج مانند CSS و جاوا اسکریپت، واقعا می تواند در صفحات ایستادگی کردن. بهترین راه برای دریافت راحت با HTML فقط به یک ظرف غذا با آن در اطراف، چه کار می کند، و چه چیزی را نمی بینم. 

نام من Daven Farnham است. این CS50 است. 

بنابراین برای مثال، من می توانید استفاده کنید تصویر کلاس - نه، بسیاری از صفات وجود دارد. نام من Daven Farnham است. این CS 650 است. من می خواهم بگویم CSS. این CSS است.