معرفی تنه اصلی و تگ های پایه ی Html

دسته بندی: آموزش
زمان مطالعه: 3 دقیقه
۱۸ شهریور ۱۳۸۷

 

:: همونطور كه در پست قبلي گفته بودم امروز به معرفي تنه ي اصلي يك فايل Html و تگ‌ها اصلي اون مي پردازم .

يه نكته اول در مورد تگ‌ها بگم . خيلي‌ها پرسيده بودن كه اصلا تگ چي هست؟

اينو بگم كه يك تگ رو به صورت <Tag> يا <Tag/> نمايش ميدن .

هر تگي كه مثلا به شكل <Tag> وجود داشته باشه  حتما يه تگ پاياني به شكل <Tag/> داره . مثلا وقتي ميگن فلان كد رو بزاريد بين تگهاي بادي ، يعني اينكه بزاريدش بين تگ آغازي <Body> و تگ پايانيش كه <Body/> هست .

خوب بريم سر اصل مطلب :

 :: تنه ي اصلي يك فايل HTML :

بدنه ي اصلي يك فايل html از چند تا تگ اصلي بوجود مياد . من اول تنه ي اصلي رو براتون ميزارم و بعد كاريرد هر جزء اونو براتون توضيح ميدم :

تنه ي اصلي يك فايل Html به شكل زير هست :

همونطور كه ميبينيد هيچ تگي به صورت تنها وجو نداره .

يك صفحه ي Html با تگ آغازي <html> شروع ميشه و با تگ پاياني <html/> تموم ميشه . و بقيه ي كدها و تگ‌ها در بين اين دو تگ قرار ميگيرن .

خوب حالا من در زير هر كدوم از اين تگ هايي كه تنه ي اصلي رو بوجود ميارن براتون معرفي مي كنم و كاربرد هر كدومو توضيح ميدم  .

<html> <head> <title>عنوان صفحه</title> </head> <body> قسمتي كه نمايش داده مي شود </body> </html>

:: تگ هاي Html : اين تگ با <html> شروع ميشه و با تگ پاياني <html/> تموم ميشه .

تمام كدها و تگهاي Html و ... بين اين دو تگ قرار مي گيرن . كاربرد تگ <html> اينه كه به مرورگر ميفهمونه كه اين يك فايل Html هست و اينكه مروگر اونو چطور نمايش بده .

:: تگ هاي Head : اين تگ هم با <head> شروع ميشه و با تگ پاياني <head/> تموم ميشه .

در واقع مشخصات ، خصوصيات و تنظيمات يك فايل Html در بين تگ هاي <head> و<head/> قرار مي گيره . مواردي كه در بين اين دو تگ قرار ميگيره در صفحه نمايش داده نميشه .  از جمله تگ هايي كه بين اين دو  قرار ميگيرن تگهاي meta و  Style هستن كه بعدا به موقش در مورد اونا هم بحث مي كنم .

:: تگ هاي Title : كلمه يا متني كه بين تگ <title> و <title/> قرار ميگيره عنوان صفحه رو مشخص ميكنه . همون عنواني كه در بالاي پنجره ي اينترنت اكسپلورر نمايش داده ميشه . پس اگه خواستيد عنوان صفحه ي خود رو عوض كنيد بايد متن بين اين تگ رو تغير بديد و عنوان مورد نظر رو بين اين دو تگ بزاريد  .

:: تگ هاي Body : شايد بشه گفت اساسي ترين تگ Html همين تگ هاي بادي هستن كه با تگ <body> شروع و با تگ <body/> به پايان ميرسه .

اهميت تگهاي بادي در اينه كه تنها اطلاعات بين اين دو تگ در صفحه ي وب نمايش داده ميشن .  يعني تمام قسمت هايي كه در يك صفحه ي وب نمايش داده ميشن و ما اونا رو ميبينيم كدشن بين اين دو تگ قرار داره . مثل جدول‌ها ، متن‌ها و پستهايي كه ميديد ، تمام نوشته‌ها و عكس‌ها و خلاصه هر چي كه توي صفحه نمايش داده ميشه .

:: اميدوارم با تنه ي اصلي يك فايل Html آشنا شده باشد . در هر صورت من سعي كردم كه هر چقدر مي تونم ساده‌تر و خودموني تر  توضيح بدم . ضمنا من سعي ميكنم چيزايي رو كه بدردتون ميخوره آموزش بدم و از تعريف و توضيح اصطلاحات و ... بپرهيزم .

 

چه امتیازی به این مقاله می دید؟
نویسنده لقمان آوند
بیش از 15 سال هست که برنامه نویسی می کنم و از بین همه زبون هایی که کار کردم جاوا، اسمبلی و php رو دوست دارم. دانشجوی دکترای نرم افزارم و توی دانشگاه روی پردازش بیگ دیتا و پردازش موازی کار کردم و عاشق چالش از هر نوعیش هستم! سون لرن مثل بچه منه که 12 سال براش وقت گذاشتم، اینجا همه تلاش می کنیم از شروع یادگیری تا ورود به بازر کار حوزه برنامه نویسی و IT همراهتون باشیم.
ارسال دیدگاه
خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :

 

نظرات کاربران

babak.namaki

آقایون
واقعا جیگر شما را …
قول میدم که شاگرد خوبی باشم.
و درسامو خوب یاد بگیرم.
راستی
من دانشجوی ترم 3 آی تی هستم. 😎

لقمان آوند

ممنون عزیز
موفق باشی …

Sina4everafter

ببخشید.کد و نشون نداد.این کد:

&lt;!DOCTYPE html&gt;
لقمان آوند

سلام
این تگ از html نیست و صرفا نوع و ورژن html استفاده شده در صفحه رو مشخص می کنه که مرورگرها بهتر بتونن کد رو بفهمن . در واقع نوع سند html رو مشخص میکنه . میتونی اینو بخونی : DocType

Sina4everafter

سلام.ببخشید یه سوال داشتم:
میشه بگین که این چه کدیه؟یعنی چی کار می کنه؟
چون من با نوشتن و ننوشتنش هیچ تفاوتی نمی بینم.مرسی. ❓

manigeh

با سلام….

نحوه انتقال معلومات و درس شما بسيار روان و عالي است…
سپاس و پايدار باشيد…..

firouzeh

مرسی واقعا عالی بود و کلی استفاده کردم

ابوعدنان

خيلي خيلي ممنون از اطلاعاتيكه در اختيارگذاشتي هم ساده بود وهم كاربردي

فرشاد

سلام خسته نباشید
آقا واقعا کارتون درسته
مطالبتون عالی واضح آمیانه و قابل فهمه
و اینکه اندوخته های علمی خوتون رو بدون منت در اختیار ما تازه کارها میزارید ممنونم
من 2 تا درخواست از شما دارم :
1-اگه امکانش هست مطالب بیشتری در زمینه آموزش طراحی و html بزارید
2-آیا میشه یک فرم خرید کالا برای وبلاگ درست کرد؟ (به این صورت که هر کسی اطلاعات مربوط به خرید کالا را پر میکند اطلاعات به صورت اتوماتیک به ایمیل ما ارسال شود) اگه براتون زحمتی نیست میشه آموزش بدین؟
ممنون
———————————-
پاسخ نویسنده(حمزه فیضیان):
درود بر شما. متشکرم از اظهار لطفتون. چشم در اولین فرصت. موفق باشید

MMT

با سلام
واقعا سایت خوب و مفید و آموزنده ای دارید
من خیلی علاقه دارم که بتونم زبان های تحت وب رو یاد بگیرم
ای کاش می شد متن ها و مطالب رو به صورت pdf یا word برای دانلود بذارید
ممنون

کرد پرس

سلام
از لطف شما ممنون .
به پاس قدردانی از کمک های شما به سایت کرد پرس ، لینک شما را در قسمت حامیان کرد پرس قرار دادیم .