آموزش HTML به زبان ساده-قسمت سوم:تگ های head و body
معرفی تگ head
در جلسه دوم از آموزش HTML به زبان ساده، ایجاد یک فایل html را آموزش دادیم و دیدیم که درون فایل از چه تگ هایی استفاده شده بود. به عنوان شروع دانش کد نویسی باید بدانید که هر فایل html از دو بخش اصلی head و body تشکیل شده است که به ترتیب به معنای “سر و بدن” هستند. اگر این ساختار را به بدن انسان تشبیه کنیم می‌توانیم بگوییم درون سر یک مغز قرار دارد که به ما کمک می‌کند زبان های مختلف یا حتی اسم خودمان را یاد بگیریم. و بدن ما آموخته های مغز را اجرایی می‌کند.
حالا دوباره به بحث سند html برمی‌گردیم. میان تگ های head می‌توانیم لینک هایی از زبان های مختلف مانند زبان طراحی CSS یا فونت هایی همچون font awesome که یک فونت تصویری است را قرار بدهیم. همچنین می‌توانیم با استفاده از تگ title عنوان صفحه خود را تعیین کنیم. دیدید که رفتار تگ head دقیقا مشابه سر انسان است.
گفتیم تگ head همانند سر انسان است. علاوه بر وجود مغز در سر ما می‌توانیم روی سر خود یک کلاه بگذاریم یا اینکه یک ماسک روی صورت خود بگذاریم. درتگ head نیز این رفتار وجود دارد و ما می‌توانیم انواع تگ های دیگر مانند تگ های متنی را در بین آن قرار دهیم. اما بهتر است از این کار اجتناب کنید.
اینکه از چه تگ هایی می‌توان درون قسمت head استفاده کرد را در جلسات نهایی به طور کامل به شما آموزش می‌دهیم زیرا در حال حاضر شما دانش کافی برای ایجاد چنین تگ هایی را ندارید. اما در آخر همین مقاله به دو نمونه از این تگ ها اشاره می‌کنیم. پس با ما همراه باشید و حوصله پیشه کنید.
معرفی تگ body
همان طور که گفتیم تگ body همچون بدن انسان است که از سر یا مغز پیروی می‌کند. در کد نویسی html نیز هرآنچه درون تگ body قرار می‌گیرد از تگ هایی که درون تگ head قرار دارند، پیروی می‌کنند. به عنوان مثال اگر درون تگ head فونت نستعلیق را فراخوانی کنیم تمام متن های درون تگ body به فونت نستعلیق تغییر می‌کنند. درون تگ body شما باید ساختار صفحه سایت خود را تنظیم کنید. و این کار نیز اصول و قواعدی دارد که در درس های آینده به شما آموزش خواهیم داد.
در درس قبلی گفتیم که HTML5 نوع بهبود یافته و پیشرفته تر HTML است. حال که با تگ body آشنا شدید می‌توانیم توضیحات خود را گسترده تر کنیم. درHTML برای تعیین رنگ نوشته ها یا لینک های یک سایت باید درون تگ باز بدنه یعنی <body> صفاتی مانند رنگ نوشته،رنگ لینک ها و… را قرار می‌دادیم اما به لطف فناوری CSS و HTML5 دیگر نیازی به این کار نیست و می‌توانیم با استفاده از CSS همه عناصر داخل بدنه سایت را به طور کامل کنترل کنیم.
برای اینکه با توضیحات ارائه شده اُنس بگیرید کافی است به قطعه کد های درون باکس زیر توجه کنید.
See the Pen dybeevo by amir (@amir5250) on CodePen.0
ما در قسمت سر یا head نیز یک متن قرار داده‌ایم تا شما با موضوعات ذکر شده بیشتر آشنا شوید. اما همانطور که می‌بینید نوشته های درون باکس از چپ به راست چیده شده اند که این موضوع دلیلی برای نگرانی ندارد. در درس های بعدی شما با تگ های متنی بیشتر آشنا می‌شوید و به شما روش راست چین کردن متن ها آموزش داده می‌شود.
در قسمت معرفی تگ head به شما وعده نمایش دو نمونه از تگ های مجاز قسمت head را داده بودیم. حال اگر به جعبه کد ها نگاهی دقیق بیاندازید متوجه حضور یک تگ متا و یک تگ عنوان می‌شوید که در اولی نوع رمز گذاری سایت را که در جلسه‌ی دوم این دوره آموزش توضیح داده بودیم را تعیین کردیم و نوع آن را روی استاندارد UTF-8 قرار دادیم و در تگ دوم عنوان سایت خود را تعیین کردیم. می‌بینید که هر دو تگ چیزی را در صفحه نمایش نمی‌دهند زیرا اولی یک به بدنه دستور داده تا از استاندارد UTF-8 پشتیبانی کند و تگ دوم عنوان سایت است که در قسمت مخصوص url مرورگر ها نمایش داده می‌شود.
در جلسه اول ذکر کردیم که هر تگ باز، یک تگ بسته مشابه نیز دارد. و همچنین گفتیم که برخی از تگ ها تکی هستند. در جعبه بالا می‌توانید مشاهده کنید که تگ meta فقط دارای تگ باز بوده و تگ بسته ای ندارد. در حالی که تمام تگ های موجود در قطعه کد بالا دارای تگ بسته مشابه هستند.
0 دیدگاه
قوانین ارسال دیدگاه در وبسایت "به اضافه"
1. وبسایت "به اضافه" تابع قوانین کشور است ، لطفا هنگام ارسال دیدگاه ، به قوانین جمهوری اسلامی ایران احترام بگذارید.
2. از ارسال هر گونه ناسزا و الفاظ رکیک خودداری نمایید. در صورت مشاهده ، نظر شما تایید نخواهد شد.
3. نظراتی که به توهین علیه اقوام ، نژاد ها ، ادیان و یا حزب خاصی بپردازد ، مورد تایید نخواهد بود.
4. هر گونه توهین به کاربران ، نویسنده مطلب و یا مدیر سایت پذیرفته نیست.
5. هر گونه فعالیت تبلیغاتی در بخش دیدگاه ها ، ممنوع است.
6. ارسال دیدگاه های نامرتبط با مطلب ، مجاز نیست.
7. تمامی کاربران باید هنگام ثبت نام در سایت، از کلمات مناسب در نام کاربری خود استفاده کنند. در صورت مشاهده‌ی کلمات رکیک و نامناسب، اشتراک آن كاربر حذف خواهد شد.
8. در بخش ویرایش پروفایل ، کاربران قادر به تغییر تصویر پروفایل هستند. در صورت مشاهده استفاده از تصاویر مستهجن ، زننده و توهین آمیز حساب کاربری حذف خواهد شد.
9. زبان اصلی سایت "به اضافه" فارسی است. دیدگاه های انگلیسی و یا فینگلیش حذف خواهد شد.
10. وبسایت "به اضافه" یک سایت تخصصی در حوزه فناوری است. خواهشمند است از هر گونه فعالیت سیاسی پرهیز نمایید.