مقررات

در اینجا چند اصطلاح وجود دارد که در زیر با آنها مواجه خواهید شد.

1. www- مخفف معروف وب جهانی، مترادف اینترنت.
2. وبمخفف شبکه جهانی وب است.
3. صفحه وب- یک سند جداگانه (یک فایل متنی تهیه شده به روشی خاص) که در اینترنت ذخیره می شود.
4. مرورگر اینترنت- نرم افزار مورد نیاز برای نمایش یک صفحه وب
5. سایت اینترنتی- مجموعه ای از صفحات وب متعلق به یک مالک.
6. صفحه نخست- صفحه اصلی (عنوان) سایت.
7. URL- Uniform Resource Locator که برای تعیین آدرس یک صفحه در WWW استفاده می شود.
8. وب سرور- کامپیوتری با نرم افزار مخصوص که باید صفحات وب را روی آن قرار داد تا در اینترنت دیده شوند.

فرامتن چیست؟

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

HTML چیست؟

HTML مخفف اچ yper تیداخلی مآرکوپ Lزاویه، یعنی زبان نشانه گذاری فرامتن این استانداردی است که اسناد وب توسط مرورگرها ارائه می شوند. همانطور که از نام آن پیداست، HTML روشی برای علامت گذاری متن ساده است به گونه ای که مرورگر اطلاعات را با فرمت صحیح نمایش می دهد. فایل های حاوی متن با نشانه گذاری html باید پسوند داشته باشند htmیا html.

دستورات زبان HTML تگ (برچسب) نامیده می شوند، آنها نشان می دهند که چه عملیاتی باید انجام شود، به عنوان مثال، نمایش متن، رسم خط یا استفاده از گرافیک. تگ های موجود در متن می توانند فونت ها، سبک ها را تغییر داده و جلوه های ویژه ایجاد کنند. این به شما امکان می دهد هنگام نمایش یک فایل متنی استاندارد، یک رابط گرافیکی جالب ارائه دهید. علاوه بر تغییر سبک متن، HTML همچنین به مرورگر می‌گوید که چه زمانی برخی از متن‌ها در صفحه باید به عنوان پیوند فرامتن در نظر گرفته شود، کجا باید گرافیک و عناصر خاص، ارسال دستورات ایمیل و سایر ویژگی‌های دسترسی را درج کند.

HTML یک زبان برنامه نویسی به معنای کامل کلمه نیست. فرمت خاصی دارد که استاندارد جهانی است. این استاندارد نامیده می شود تعریف نوع سند(تعریف نوع سند)، یا DTD.نسخه 1.0 اولین HTML DTD بود که به وب معرفی شد. سپس نسخه 2.0 برای WWW ایجاد شد که متفکرانه تر بود. اکنون استاندارد HTML نسخه 4.0 است.

ساختار فرمان HTML

دستورات HTML (برچسب ها) در براکت های زاویه ای محصور می شوند:

<название_команды>- دستور شروع

فیلد فرمان

- پایان فرمان

استاندارد زبان HTML مستلزم وجود تگ پایان فرمان است، مگر اینکه خلاف آن ذکر شده باشد.

اولین دستور در یک سند html دستور است ، به ترتیب، آخرین دستور این خواهد بود -(تلفظ شده "نه html").

به طور کلی، ساختار یک سند html به شکل زیر است:

آن ها دو بخش مجزا وجود دارد: ("سر") و ("بدن").

اظهار نظر.زبان HTML به حروف بزرگ و کوچک حساس نیست. دستورات زبان را می توان با حروف بزرگ و کوچک تایپ کرد، یعنی. فرمان معادل دستور است یا .
اگر مرورگر از دستور پشتیبانی نمی کند، به سادگی آن را نادیده می گیرد.

اولین خط یک سند html یک فرمان ابزاری است که به مرورگر اجازه می دهد تا نوع سند (DOCTYPE) را به عنوان یک سند در استاندارد HTML 4.0 که توسط IETF (گروه وظیفه مهندسی اینترنت) تعریف شده است، شناسایی کند. این خط همچنین DTD مربوطه را نشان می دهد (اعلام نوع سند - شرح نوع سند): سند PUBLIC است (یعنی به تنظیمات سیستم بستگی ندارد) و زبان سند روسی (RU) است.

در قسمت سر سند html دستوری وجود دارد که نام صفحه را در عنوان پنجره مرورگر (نوار آبی در بالای پنجره) نمایش می دهد:

متن واقعی که باید در سند html باشد بین دستورات قرار می گیرد و، مثلا:

به HTML خوش آمدید!

برای اینکه ببینید این مثال در مرورگر چگونه به نظر می رسد، باید همه چیز را در Notepad کپی کنید، فایل را با نام ذخیره کنید. primer.htm، و سپس در Explorer روی نام فایل کلیک کنید - در نتیجه این سند html به طور خودکار در پنجره اینترنت اکسپلورر باز می شود:

ویژگی های

دستورات می توانند پارامترهایی به نام داشته باشند ویژگی های. ویژگی ها اجرای یک دستور را تغییر می دهند، بلافاصله بعد از نام دستور، داخل براکت های زاویه قرار می گیرند و دارای فرمت زیر هستند:

ATTRIBUTE="attribute_value"

اگر ویژگی_value از یک کلمه تشکیل شده باشد، علامت نقل قول لازم نیست. اگر ویژگی_value حاوی فاصله یا کاراکترهای غیر الفبایی باشد، نقل قول لازم است.

اگر یک فرمان چندین ویژگی داشته باشد، آنها با فاصله از هم جدا می شوند:

<название_команды

ویژگی1="ویژگی_مقدار1"

atribute2="attribute_value2">

به عنوان نمونه ای از ویژگی ها، دستور را در نظر بگیرید ، که رمزگذاری ویندوز را برای حروف الفبای روسی تنظیم می کند و قرار دارد به شدت در داخلبخش :

اگر فرمان جست و خیز کنید، در این صورت شرایطی امکان پذیر است که در صفحه مرورگر به جای حروف روسی "krakozyabry" وجود داشته باشد. و هنگام استفاده از این دستور این اتفاق نمی افتد!

ویرایشگرهای HTML

تمام اسناد html به صورت متن ساده نوشته می شوند، بنابراین می توان آنها را در هر ویرایشگر متنی مانند Notepad ایجاد و ویرایش کرد. اما برای مثال استفاده از ویرایشگرهای html تخصصی بسیار راحت تر است UltraEdit(مجوز) یا وب ساز هوشمند(رایگان).

در این ویرایشگرها، تمام دستورات زبان HTML به یک رنگ و ویژگی های فرمان در رنگ دیگر نمایش داده می شوند. در حالی که فقط متن سیاه خواهد بود. به همین دلیل، اگر نام یک فرمان (یا ویژگی) اشتباه نوشته شود، مانند متن معمولی به رنگ سیاه نمایش داده می شود.

رنگ در سند html

فرمان چندین ویژگی دارد

ویژگی bgcolor= به شما امکان می دهد رنگ پس زمینه صفحه را تنظیم کنید:

این صفحه دارای پس زمینه زرد است.

رنگ را می توان به دو صورت مشخص کرد:

• تعیین نام رنگ انتخاب شده.
• با تعیین یک عدد رنگ به عنوان نسبت سایه های قرمز، سبز و آبی (قرمز-سبز-آبی=RGB).

شماره رنگ RGB یا با سه عدد دو رقمی هگزا دسیمال (HEX) مشخص می شود (عدد باید قبل از علامت # باشد)، یا با استفاده از تابع ()rgb داخلی که هر یک از سه آرگومان آن می تواند از 0 تا متغیر باشد. 255، برای مثال: rgb(153,102,255). هر عدد از بازه () شدت رنگ مربوطه را تعیین می کند.

به عنوان مثال، شماره رنگ "#FF0000"=rgb(255,0,0) با رنگ قرمز (قرمز) مطابقت دارد، زیرا حداکثر شدت مولفه قرمز را دارد و اجزای سبز و آبی دارای مقادیر برابر هستند. به صفر به طور مشابه، عدد "#00FF00"=rgb(0,255,0) با سبز (سبز) و عدد "#0000FF"=rgb(0,0,255) با آبی مطابقت دارد.

16 نام رنگ استاندارد وجود دارد که توسط ویندوز پشتیبانی می شود:

	سیاه = "#000000"		سبز = "#008000"
	نقره = "#C0C0C0"		آهک = "#00FF00"
	خاکستری = "#808080"		زیتون = "#808000"
	سفید = "#FFFFFF"		زرد = "#FFFF00"
	مارون = "#800000"		نیروی دریایی = "#000080"
	قرمز = "#FF0000"		آبی = "#0000FF"
	بنفش = "#800080"		Teal = "#008080"
	فوشیا = "#FF00FF"		Aqua = "#00FFFF"

علاوه بر این 16 نام رنگ، یک جدول رنگی توسعه یافته نیز وجود دارد. می توان از نام رنگ ها از این جدول استفاده کرد، اما هنوز هم تنظیم شماره RGB قابل اعتمادتر است. واقعیت این است که اگرچه وظیفه قرمز-سبز-آبی از نظر تئوری به شما امکان نمایش "یک میلیون" رنگ را می دهد، در واقع همه چیز توسط کارت گرافیک و مانیتوری که مشتری استفاده می کند تعیین می شود.

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

عناوین

HTML دارای شش سطح عنوان است که از 1 تا 6 شماره گذاری شده اند (عنوان سطح اول بزرگترین عنوان است). در مقایسه با متن معمولی، سرفصل ها به صورت خودکار پررنگ می شوند.

نحو هدر:

بزرگترین عنوان، در مرکز

عنوان با اندازه متوسط، به عنوان؟

کوچکترین هدر

در اینجا h خود فرمان هدر است ( سرتیتر، و یک عدد از 1 تا 6 اندازه هدر را تعیین می کند.
align= - مشخصه ای که مکان عنوان را در صفحه مشخص می کند:
align=left - مکان در سمت چپ (به طور پیش فرض پذیرفته شده است، یعنی نمی توانید مشخص کنید)
align=center - پنجره را در مرکز قرار دهید
align=right - در سمت راست پنجره مرورگر قرار دهید.

پاراگراف ها

فرمان پاراگراف

همچنین دارای یک ویژگی align= است که علاوه بر سه مقدار بالا، می تواند مقدار justify را نیز داشته باشد:

که تراز لبه سمت راست متن را روی صفحه تنظیم می کند (همانطور که در این متن انجام می شود).

برخلاف اسناد ایجاد شده در ویرایشگر Word، شکست خط در اسناد html ضروری نیست. یک خط شکسته می تواند در هر فضایی در فایل منبع شما رخ دهد و بیننده نادیده می گیرد. مثلا:

فصل 1

به HTML خوش آمدید!

به شما می گوید که چگونه و چگونه صفحات وب بسازید.

آنقدرها هم سخت نیست.

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

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

دانشکده
جایی که ما یاد می گیریم

فضای بدون شکست

از آنجایی که مرورگر شکسته‌های خط را در فایل html نادیده می‌گیرد، جایی که یک خط روی صفحه در واقع به پایان می‌رسد و خط دیگری شروع می‌شود، بستگی به اندازه فونت روی صفحه مشتری دارد. علاوه بر این، مرورگر هر تعداد فاصله بین کلمات را نادیده می گیرد - همه فضاها با یکی جایگزین می شوند. بنابراین، اگر می خواهید چندین فاصله را در یک ردیف قرار دهید، به اصطلاح شخصیت بدوی"فضای بدون شکست" که با علامت (&) شروع می شود و با نقطه ویرگول به پایان می رسد: (مختص برای فضای بدون شکست).

کاراکترهای اولیه به حروف کوچک و بزرگ حساس هستند: نمی توان به جای آن از آن استفاده کرد.

به عنوان مثال، خط

دانشکده ای که در آن تحصیل می کنیم

روی صفحه نمایش به صورت زیر خواهد بود:

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

در تایپوگرافی روسی، قوانین سختگیرانه ای برای قرار دادن کاراکتر فضایی بدون شکستگی وجود دارد.

شخصیت فضایی بدون شکست(ما آن را به صورت ) در موارد زیر تنظیم می کنیم.

1. قبل از خط تیره:
   این یک نمونه است
   آن ها خط تیره مجاز به شروع یک خط نیست مگر اینکه شروع یک جمله گفتاری مستقیم باشد.
2. بین دو حرف اول و اول و نام خانوادگی:
   I. I. Ivanov
   آن ها گزینه بدون فاصله: I.I. Ivanov - کاملا غیر قابل قبول!
3. بین یک علامت عددی (#) یا یک علامت پاراگراف (§) و ارقام زیر:
   شماره 7، § 3
   و در اینجا گزینه بدون فاصله وجود دارد: شماره 7 - معمولی ترین اشتباه فاحش!
4. بین عدد و واحد اندازه گیری زیر:
   قرن 18، 10 کیلوگرم، 2000
5. بین مخفف و نام خانوادگی:
   آقای پتروف
6. پس از اختصارات جغرافیایی:
   نووسیبیرسک، آر. Ob

تغییر متن

برای نمایش متن با تغییر جزئی به راست (از لبه چپ صفحه)، مانند شعر، از دستورات استفاده کنید:

دانشکده
جایی که ما یاد می گیریم

روی صفحه نمایش به صورت زیر خواهد بود:

لیست ها

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

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

سه نوع اصلی لیست وجود دارد: لیست های گلوله ای (بدون شماره)، شماره گذاری شده و لیست های تعریفی. آنها از این نظر شبیه هستند که همه آنها هر مورد را در یک خط جدید قرار می دهند و شما می توانید متن مورد نظر خود را برجسته کنید. تفاوت اصلی بین انواع ذکر شده در روش شماره گذاری و ساختار است.

لیست گلوله ای

رایج ترین مورد استفاده، لیست نامرتب یا گلوله ای است. هر مورد در چنین لیستی با یک نماد مینیاتوری شروع می شود.

یک لیست گلوله ای با دستورات مشخص می شود (فهرست نامرتب) و موارد لیست بین دستورات با استفاده از دستور مشخص می شود.

(ListItem).

به عنوان مثال لیست کنید

سیستم های اعداد

• غیر موضعی
  
• موضعی
  

به این صورت خواهد بود:

دستور لیست

دارای ویژگی type= است که نوع نشانگر را برای عناصر لیست تعیین می کند:
- دایره سیاه (مقدار پیش فرض)

- دایره روشن

- مربع

اگر یک لیست در لیست دیگر تودرتو باشد، نوع نشانگر به طور خودکار تغییر می کند:

سیستم های اعداد





• غیر موضعی

• مصر باستان

• رومی

• اسلاوی قدیم

• موضعی

• بابلی

• هندی

  روی صفحه نمایش به این صورت است:

  لیست شماره گذاری شده

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

  لیست شماره گذاری شده با استفاده از دستورات مشخص می شود

  (فهرست سفارشی) و
  . همانطور که در یک لیست گلوله ای، هر آیتم با دستور مشخص می شود
• ، مثلا:

  سیستم های اعداد

  
  
  
  
  1. غیر موضعی
     
  2. موضعی
     

  به این صورت خواهد بود:

  همانطور که می بینید، هیچ عددی (1، 2) در کنار آیتم های لیست در فایل منبع وجود ندارد.

  به طور پیش فرض، لیست های HTML به طور خودکار با اعداد عربی شماره گذاری می شوند - 1، 2، 3، و غیره. برای تغییر نوع شماره گذاری پیش فرض، به دستور اضافه کنید

  نوع = ویژگی

  در زیر پنج روش ممکن برای شماره گذاری وجود دارد:

  : شماره گذاری عددی استاندارد - 1، 2، 3، ...
  
  : حروف بزرگ - A، B، C، D، ...
  
  : حروف کوچک - a، b، c، d، ...
  
  : اعداد رومی - I، II، III، IV، V، ...
  
  : اعداد رومی کوچک - i، ii، iii، iv، v، ...

  اگر می خواهید شماره گذاری لیست از یک عدد خاص شروع شود، باید به دستور اضافه کنید

  همچنین ویژگی start=، برای مثال،
  .

  لیست تو در تو

  سیستم های اعداد

  
  
  
  
  1. غیر موضعی
     
     
     1. مصر باستان
        
     2. رومی
        
     3. اسلاوی قدیم
        

  2. موضعی
     
     
     4. بابلی
        
     5. هندی
        

     روی صفحه به این صورت است:

     فهرست تعاریف

     اگرچه به اندازه لیست های گلوله ای یا شماره گذاری شده معمولا استفاده نمی شود، لیست های تعریف نیز می توانند در برخی موارد مفید باشند. فهرست تعاریف برای هر مورد نه یک، بلکه دو خط ارائه می‌کند که در صورت ارائه اطلاعات اضافی می‌تواند مفید باشد.

     لیست های تعریف کمی متفاوت از انواع دیگر لیست ها به نظر می رسند. برای تنظیم خود لیست، از دستورات استفاده می شود

     (فهرست تعریف) و

     . در این مورد، از دو دستور برای توصیف هر آیتم لیست استفاده می شود، نه یک دستور. فرمان
     (Definition Term) یک عنصر واحد یعنی عبارت تعریف شده و فرمان را مشخص می کند
     (تعریف توضیحات) - بقیه اطلاعاتی که در خط تورفتگی بعدی نمایش داده می شود. خط دوم اطلاعات را تعریف می نامند.

     مثال لیست تعریف:

     
     

     MMF
     

     دانشکده مکانیک و ریاضیات.
     

     مناسب
     

     دانشکده فناوری اطلاعات.
     

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

     اهداف و اهداف اصلی HTML

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

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

     HTML ابزاری برای به اصطلاح توسعه وب سایت front-end است. این یعنی چی؟ حتما بیش از یک بار شنیده اید که در محیط ساخت سایت مفاهیمی مانند front-end و back-end وجود دارد. بنابراین، توسعه front-end (front-end) شامل ابزارها و زبان هایی است که وظیفه نمایش مستقیم سایت را به کاربر بر عهده دارند. با استفاده از مرورگرهای مختلف (اینترنت اکسپلورر، اپرا، موزیلا، کروم و غیره) نمایش داده می شود. در مورد بخوانید. مرورگرها HTML و CSS را به خوبی درک می کنند و اطلاعات دریافتی را به فرمی کاربرپسند تبدیل می کنند.

     توسعه Back-end بر اساس زبان های سمت سرور مانند PHP است. با استفاده از کد PHP، داده های سایت توسط سرور شناسایی می شود و پس از تبدیل کد توسط یک مفسر خاص، به مرورگر منتقل می شود. آن ها مرورگر به نوعی سایت را در قالب نشانه گذاری HTML و سبک های CSS دریافت می کند. می توانید کد منبع سایت را مشاهده کنید، به عنوان مثال، در . همیشه نمی توان از روی کد منبع تعیین کرد که یک سایت به چه زبان برنامه نویسی نوشته شده است، اما بدون در نظر گرفتن این موضوع، کدهای سبک CSS و تگ های HTML را مشاهده خواهید کرد.

     یادگیری HTML را از کجا شروع کنیم؟

     اگر در مورد یادگیری این زبان جدی هستید، به شما توصیه می کنم بلافاصله چند کتاب مفصل را با نظرات خوب یا دوره های ویدیویی دانلود کنید. برای شروع، می توانید این ویدیو را تماشا کنید:

     جدیدترین نسخه زبان HTML که بسیار فراتر از علامت گذاری ساختار متن است، HTML5 است. علاوه بر این، در مقایسه با HTML4، آخرین نسخه دارای بسیاری از برچسب های جدید است، معناشناسی تغییر کرده است.

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

     برای ایجاد یک سند html، از یک ویرایشگر مناسب استفاده می کنیم.

     اولین چیزی که باید اعلام کنید نوع سند با پیوند به بخش مربوطه آن است:

     1 2	"https://www.w3.org/TR/html4/loose.dtd">

     حالا بیایید یک صفحه index.html ساده با نظرات زیر ایجاد کنیم:

     1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

     "https://www.w3.org/TR/html4/loose.dtd"> <html > <سر > <متا http-equiv = "Content-Type" content = "text/html; charset=utf-8" / > <عنوان >عنوان صفحه</title> <styletype="text/css"> </style> </head> <بدن> <h1 >عنوان شماره 1 صفحه</h1> <div class="block1"> </div> <h2 >زیرنویس 2</h2> <div class="block2">بلوک صفحه دوم</div> </body> </html>

     عنوان شماره 1 صفحه

     اولین بلوک صفحه با یک پاراگراف. خط دوم بلوک از پاراگراف

     زیرنویس 2

     بلوک صفحه دوم

     در نتیجه هنگام باز کردن این فایل index.html صفحه زیر در مرورگر نمایش داده می شود:

     بیایید اجزای آن را با جزئیات بیشتری تجزیه و تحلیل کنیم.

     چارچوب سند تگ های html، head، body است. و بقیه در تگ html محصور شده اند:

     1 2 3 4 5 6

     <html > <سر > </head> <بدن> </body> </html>

     بر این اساس، تگ html باز شدن را برای خواندن و بسته شدن سند html اعلام می کند ( - برچسب باز کردن- برچسب بستن).

     سر - این "سر" سند است، شامل اطلاعاتی است که در بدنه سند نمایش داده نمی شود. بر این اساس، بدن «بدنه» سند یا قسمت قابل مشاهده آن است.

     در هد کدگذاری (charset=utf-8) و عنوان صفحه را مشخص می کنیم. در مرحله بعد برای گزینه بالا، استایل ها را با استفاده از تگ به هم متصل می کنیم

     در مورد ما، ما بلوک های blok1 و blok2 را یک ظاهر طراحی می کنیم. ما این بلوک ها را در داخل تگ های بدنه با استفاده از تگ ها ایجاد کردیم

     ، که کلاس مربوطه برای آن تنظیم شده است (class=”blok1”). بنابراین، ما نام کلاس را با استایل آن مرتبط کرده ایم.

     همانطور که در اسکرین شات می بینید، اولین بلوک blok1 دارای یک پر زرد است، در حالی که blok2 قاب شده و رنگ متن آن آبی است. ما همه اینها را با استفاده از سبک های css که با استفاده از تگ سبک html متصل شده اند تنظیم می کنیم.

     به طرح توجه کنید: