عنصر لیست را مانند زیر جدا کنید

، و همچنین در
با یک برچسب تشکیل شده است < لی> .

تمرین 3

1. یک لیست شماره دار تحت عنوان "پروژه های خانه" ایجاد کنید.

2. یک لیست گلوله دار تحت عنوان House Areas ایجاد کنید. کد شما به این شکل خواهد بود (شکل 12).



شکل 12

3. صفحه را در مرورگر مشاهده کنید.

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

نمونه ای از یک لیست تو در تو در شکل نشان داده شده است. 13

تمرین 4

1. کد نشان داده شده در شکل 13 را در یک فایل جدید پیاده سازی کنید.
2. فایل را در یک پوشه ذخیره کنید خانهی منزیر اسم فهرست_ vlozh. html. نتیجه در شکل. 13



شکل 13. مثال لیست تودرتو

سبک های فونت

برچسب بزنید … - به شما امکان می دهد متن را به صورت پررنگ نمایش دهید.

برچسب بزنید … - به شما امکان می دهد متن را به صورت مورب نمایش دهید.

برچسب بزنید … - متن زیرخط دار را نمایش می دهد.

مثلا:

در این صورت متن نمایش داده می شود کج با حروف درشت اما خط کشی نشده است.

در این صورت متن نوشته خواهد شد حروف برجسته با خط مورب .

زیرنویس ها و بالانویس ها

برچسب بزنید < زیر> و زیر> به شما امکان می دهد متن را نیم خط زیر متن معمولی رها کنید.

برچسب بزنید < شام> و شام> به شما امکان می دهد متن را نیم خط بالاتر از متن معمولی قرار دهید. متن بین این تگ ها با فونت کوچکتر از متن معمولی نمایش داده می شود.

تمرین 5

1. نام myhouse.ru را به صورت پررنگ در پاراگراف اول فرمت کنید (شکل 14).

شکل 14

2. عبارت «بیش از 95 درصد پروژه ها» در پاراگراف دوم را با حروف مورب خط دار فرمت کنید (شکل 15).

شکل 15

3. بالانویس ها را در جایی که متر مربع استفاده می شود قالب بندی کنید (شکل 16).



شکل 16

4. فایل را ذخیره کنید. مشاهده از طریق مرورگر صفحه وب باید شبیه این باشد (شکل 17).



شکل 17

3. درج تصاویر

در مقاله نحوه ایجاد یک صفحه HTML، نحوه قرار دادن تصاویر در یک صفحه وب را بررسی خواهیم کرد.

تگ برای درج تصاویر استفاده می شود. . ویژگی مورد نیاز برای این تگ است src(از منبع انگلیسی - منبع). مسیر را مشخص می کند فایل گرافیکی، که تصویر آن باید در صفحه وب نمایش داده شود.

برای درج تصویر از دستور استفاده کنید

مثلا: " image1.jpg" alt="تصویر" /> !}

ویژگی alt ضروری است تا هنگام مشاهده یک صفحه وب در حالت غیرفعال تصاویر، به جای تصویر گم شده، کتیبه ای وجود داشته باشد که در ویژگی alt نوشته شده باشد. همچنین توصیه می شود همیشه از متن های جایگزین استفاده کنید، زیرا موتورهای جستجو هنگام جستجوی تصاویر، آنها را به عنوان کلمات کلیدی تجزیه می کنند.

فایل های گرافیکی می توانند با فرمت باشند jpg، gif، png و لزوما در مدل رنگیRGB.

تمرین 6

1. پس از لیست مناطق خانه، تصاویر پروژه های کلبه را در صفحه وب قرار دهید پروژه_1.jpgو پروژه_2.jpgاز یک پوشه cd/html_css_1 . برای این کار ابتدا این دو تصویر را در پوشه ای که فایل main.html در آن قرار دارد کپی کنید. کد درج تصاویر به این صورت خواهد بود (شکل 18).

شکل 18

2. نتیجه را در مرورگر مشاهده کنید (شکل 19).



شکل 19

اساساً اصل استفاده از برچسب هاHTMLباید واضح باشد آنها طبق همان اصل مورد استفاده قرار می گیرند: اگر برچسب یک برچسب ظرف است، پس یک برچسب باز و بسته وجود دارد. اگر تگ تک باشد، دیگر تگ بسته شدنی وجود ندارد، در این حالت، برای مثال، قبل از براکت زاویه بسته، اسلش راست نوشته می‌شود.< br/>. چه برچسب یک برچسب ظرف باشد یا یک تگ واحد، همیشه می توانید مشخصات را جستجو کنیدhtml401_ru.chm در بخش "عناصر".

4. آدرس دهی در داخل سایت

در اولین آموزش خود، "چگونه یک صفحه HTML ایجاد کنیم"، مفاهیم آدرس دهی در HTML را بررسی خواهیم کرد.

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

دو نوع آدرس دهی وجود دارد:

• مطلق؛
• نسبت فامیلی.

آدرس دهی مطلق (با استفاده از نام درایوهای کامپیوتر) استفاده نشده(تصویر 20)



شکل 20

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

مثال 1 تصویر در همان پوشه سند HTML قرار دارد (شکل 21). یعنی تصویر و فایل HTML در سیستم فایل در یک سطح هستند و سند HTML می تواند بلافاصله تصویر را ضمیمه کند. در این حالت، قرار دادن یک تصویر در یک صفحه وب به این صورت خواهد بود. / > شکل 21 کار عملی7 مثال 1 را اجرا کنید (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر). تصویر

مثال 2 تصویر عکس. jpgدر پوشه است پوشه_1 . سند HTML خارج از folder_1 قرار دارد. آن ها در سیستم فایل سایت، سند HTML یک سطح بالاتر از تصویر قرار دارد (شکل 22). باید folder_1 را وارد کنید سپس تصویر را پیوست کنید شکل 22 کار عملی8 مثال 2 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود.

مثال 3 تصویر عکس. jpgدر پوشه است پوشه_1 ، که به نوبه خود در پوشه قرار دارد پوشه_2 . سند HTML خارج از این پوشه ها قرار دارد (شکل 23). بنابراین، سند HTML دو سطح بالاتر از تصویر است. لازم: پوشه پوشه_2 را وارد کنید، سپس پوشه folder_1 را وارد کنید، سپس تصویر را پیوست کنید. شکل 23 کار عملی9 مثال 3 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود.

مثال 4 پوشه_1 . تصویر خارج از پوشه_1 است. آن ها سند HTML یک سطح زیر تصویر است (شکل 24). باید از پوشه folder_1 خارج شوید، سپس تصویر را پیوست کنید. خروج از یک پوشه با ساختار نشان داده می شود ../ (دو نقطه و یک اسلاید به سمت راست). / > شکل 24 کار عملی10 مثال 4 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود.

مثال 5 سند HTML در پوشه است پوشه_1 ، که به نوبه خود در پوشه قرار دارد پوشه_2 . تصویر خارج از این پوشه ها است. بنابراین، سند HTML دو سطح پایین تر از تصویر قرار دارد (شکل 25). لازم: خروج از پوشه_1، خروج از پوشه_2، ضمیمه تصویر از آنجایی که لازم است دو بار خارج شوید، سپس ساخت و ساز ../ دو بار تکرار می کند / > شکل 25 تمرین 11 مثال 5 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود.

مثال 6 (تصویر 26) لازم: خروج از پوشه_1، خروج از پوشه_2، به پوشه folder_3 بروید، به پوشه folder_4 بروید، تصویر pic.jpg را ضمیمه کنید شکل 26 تمرین 12 مثال 6 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود.

مثال 7 (شکل 27) لازم: خروج از پوشه_1، خروج از پوشه_2، خروج از پوشه_3، پوشه پوشه_4 را وارد کنید، تصویر pic.jpg را ضمیمه کنید. از آنجا که شما نیاز به خروج از سه بار، سپس ساخت و ساز ../ سه بار تکرار می کند شکل 27 تمرین 13 مثال 7 (ایجاد پوشه، فایل doc.html، گرفتن هر تصویر) را پیاده سازی کنید. تصویر باید در صفحه وب doc.html درج شود. بنابراین، چند بار باید خارج شوید، چند بار ساختار ../ را قرار می دهیم و اگر وارد شویم، نام پوشه هایی را که در مسیر با آن مواجه شده اند لیست می کنیم.

تمرین 14

1. یک سند html ایجاد کنید و یک تصویر در آن قرار دهید تا مسیر تصویر به صورت زیر باشد.

" ../../../../../../folder_1/folder_2/folder_3/image.jpg" / >

2. نمونه خود را از درج یک تصویر در یک سند html ایجاد کنید تا حاوی و باشد خروج از پوشه ها و ورود به پوشه ها مثال باید با تمام مثال های بالا متفاوت باشد.

در نتیجه این موضوع، شما باید فایل های زیر را داشته باشید:

• template.html
• main.html
• list_vlozh.html
  
• داخل یک پوشهخانهی منباید یک پوشه وجود داشته باشدعمومی_ htmlبا فایل های سایت آینده
• هفت مثال برای آدرس دهی نسبی و دو مثال به عنوان کنترل از وظیفه عملی 14

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

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

توضیحات کلی

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

فایل HTML با هدر DOCTYPE شروع می شود که نشان دهنده نوع آن است فایل داده شده- HTML تمام عناصر صفحه (برچسب ها) در براکت های زاویه نشان داده شده اند. هر جفت ("<» и «>") شامل یک تگ HTML است. به طور معمول، تگ های HTML جفت می شوند، یعنی برای هر "برچسب" یک "/tag" وجود دارد. هر دو در براکت های زاویه ای محصور شده اند. برچسب های تکی وجود دارد که محبوب ترین "br/" انتقال به خط بعدی است.

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

صفحه HTML ساده

نمونه ای از ایجاد چنین صفحه ای در زیر در مقاله آورده شده است. بیایید آن را با دقت در نظر بگیریم.



بخش HEAD

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

• کلمات کلیدی و توضیحات صفحه؛
• پیوند به فایل های دیگر (*.css و *.js).

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

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



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

اگر قرار است به محض تقویت دانش HTML به اسکریپت نزدیک شود، باید فوراً به شیوه نامه آبشاری پرداخته شود. فایل‌های CSS، در میان چیزهای دیگر، قوانین یک ظاهر طراحی را ارائه می‌کنند تگ های HTML.

بخش BODY

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

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



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

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

یک مثال ساده (فقط بخش BODY) در زیر فهرست شده است.



و در مرورگر بازدید کننده به صورت زیر است:



کد مشخص نکرده است که عناصر نمایش داده شده توسط مرورگر چگونه باید باشند. تمام استایل های قابل مشاهده در قوانین CSS هستند. در این مورد، در فایل Mcss/scPhpWordRW.css ارجاع شده (نمونه اولین صفحه HTML را ببینید).

برخلاف HTML، موضوع CSS ساده‌تر است، قوانین بسیار قابل دسترسی وجود دارد و تعداد آنها کم است، زمانی که یک نمونه از ایجاد یک صفحه HTML به چیزی غیر از یک دفترچه یادداشت نیاز ندارد. همه چیز برای توسعه فوری بسیار در دسترس است:



این نشان می دهد که برچسب scLogo_vDoc چقدر ساده توصیف می شود، توضیحات به گونه ای است که تگ معمولاً تصویر vDoc-logo.png را نمایش می دهد و هنگامی که ماوس روی آن است تصویر vDoc-logo-h.png را نمایش می دهد.

ساختار توضیحات HTML

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

نام، در مورد یک تگ جفت، از نام واقعی (tagName) و براکت های زاویه (" تشکیل شده است.<» + tagName +«>")، اگر ما داریم صحبت می کنیمدر مورد ابتدای تگ، و "” اگر پایان آن ثبت شود.

نمونه ای از یک صفحه HTML که ویژگی ها را توصیف می کند در زیر در متن قرار دارد.



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

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



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

علاوه بر عناصر ساده، HTML برای توصیف جداول و فرم ها پیشنهاد می کند. این عناصر در «ساخت وب‌سایت روزمره» بسیار مورد تقاضا هستند.

توضیحات جدول: برچسب های TABLE، TR، TD

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



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

نمونه ای از یک صفحه HTML که یک جدول ساده را توصیف می کند به وضوح در مقاله نشان داده شده است.



در اینجا جدولی به اندازه سه ردیف در سه ستون آورده شده است و در سطر اول به جای تگ TD از تگ TH یعنی عنوان ستون استفاده شده است. این دو تگ تفاوت خاصی با هم ندارند اما می توان از اولی برای تشخیص ردیف اول جدول استفاده کرد و در CSS می توانید استایل خود را به TH متصل کنید که آن را از سایر TD ها متمایز می کند.

توضیحات فرم: تگ های FORM، INPUT

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

نمونه ای از یک صفحه HTML که یک فرم ساده را توصیف می کند:



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

با استفاده از HTML

دانستن زبان فرامتن کار در هر تخصصی در زمینه برنامه نویسی اینترنتی است، اما اگر نیاز به نوشتن برنامه به زبان PHP یا جاوا اسکریپت دارید، باید HTML + CSS را کاملا بدانید.

زبان PHP در مثال قبلی تعیین شده بود. PHP روی سرور اجرا می شود، بنابراین صفحه با این فرم با فیلدهای پر شده از سرور به مرورگر پرواز می کند. به طور خاص، تابع TestOnBlur ذکر شده در تگ INPUT (کنترل کننده رویداد onblur) تمام پارامترها را به عنوان فیلدهای متنی دریافت کرد.



جاوا اسکریپت در مرورگر کار می کند و برای اینکه دکمه به درستی داده ها را به سرور ارسال کند، یعنی ساختار: onclick=jQuery("#to").val("cart") باید داشته باشید. ایده ای نه تنها در مورد چیستی jQuery، بلکه در مورد اینکه #to، val، cart چیست. به طور دقیق تر، شما باید تگ های اولیه HTML و قوانین عمومیاعمال سبک های CSS برای آنها.

این برای بهبود سریع مهارت های شما در هر تخصص در زمینه برنامه نویسی اینترنتی کاملاً کافی است.

سلام به خوانندگان عزیز وبلاگ در این مقاله شروع به یادگیری اصول اولیه می کنیم زبان HTML.

احتمالاً می دانید که زبان اصلی اینترنت است زبان نشانه گذاری فرامتن (HTML). در این مقاله با مفاهیم اولیه HTML آشنا می شویم و نحوه ایجاد ساده ترین صفحات وب را یاد می گیریم.

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

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

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

,

, .

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

زبان HTML و برچسب های آن

اولین نسخه HTML در سال 1992 ظاهر شد. در زمان 2013، مشخصات در حال توسعه است نسخه جدیدشماره HTML 5. این مشخصات توسط کنسرسیوم وب جهانی یا به اختصار W3C ایجاد شده است. W3C همچنین سایر استانداردهای وب را توسعه می دهد. شما می توانید در سایت www.w3.org با این استانداردها آشنا شوید. به هر حال، بسیاری از مرورگرهای وب در حال حاضر برخی از ویژگی های HTML 5 را پشتیبانی می کنند.

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










وب سایت در مورد اتومبیل.




به سایت خودرو ما خوش آمدید. در اینجا مقالات جالب و مفید زیادی در مورد آن پیدا خواهید کرد ماشین ها. در این سایت توضیحاتی در مورد بسیاری از خودروهای وارداتی و داخلی ارائه شده است.







سپس صفحه وب ایجاد شده را در فایلی به نام index.html ذخیره می کنیم. در ضمن در کادر محاوره ای ذخیره فایل باید کدگذاری UTF-8 را تنظیم کرده و نام فایل را داخل گیومه قرار دهید در غیر این صورت Notepad پسوند txt را به آن اضافه می کند و فایل ما به نام index.htm می شود. txt:

اکنون باقی مانده است که فایل ایجاد شده را در مرورگر باز کنید و به نتیجه نگاه کنید. برای این کار می توانید از موارد ارائه شده استفاده کنید مرورگر ویندوز Microsoft Internet Explorer یا هر مرورگر دیگری که روی رایانه شما نصب شده است، با دوبار کلیک کردن روی فایل index.html یا کشیدن فایل روی نماد مرورگر. ما آن را باز می کنیم و چیزی شبیه به این را می بینیم:



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

تگ چیست؟

حالا بیایید در مورد ساختار صفحه بیشتر صحبت کنیم. قطعه را در نظر بگیرید:

وب سایت در مورد اتومبیل

. در اینجا متنی را می بینیم که به عنوان عنوان در صفحه نمایش داده می شود که در تگ ها محصور شده است

و

. تگ در زبان html چیست؟

تگ HTMLکلمات و نمادهای معمولی هستند که در پرانتزهای زاویه ای محصور شده اند، به عنوان مثال.

,

, . پس تگ کن

تگ آغازین، تگ است

تگ بسته شدن، و متنی که در بین آن قرار دارد محتوای تگ نامیده می شود. همچنین تگ کنید

و تگ کنید

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



پس تگ جفت کنید

عنصر عنوان سطح اول را تعریف می کند. در مجموع شش سطح سرفصل وجود دارد، این عناصر هستند

—

.

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

یک عنصر بلوک است.

این همه برای من!!! در پست های بعدی می بینمت!

: HTML - زبان نشانه گذاری فرامتن (یا زبان نشانه گذاری فرامتن).

پس بیایید او را بهتر بشناسیم.

برای شروع، یک فایل با هر نام و پسوند.html در رایانه خود ایجاد کنید (عنوان باید به زبان انگلیسی باشد)- برای مثال index.html). برای ایجاد چنین فایلی - یک معمولی ایجاد کنید سند متنی ("شروع" - "همه برنامه ها" - "لوازم جانبی" - "نوت پد")و ذخیره کنید ("فایل" - "ذخیره به عنوان")آن را در هر نقطه با وارد کردن نام و پسوند (این اتفاق می افتد که وقتی یک افزونه را وارد می کنید، notepad همچنان آن را به عنوان ذخیره می کند فایل متنی، و ما به یک فایل وب نیاز داریم. برای انجام این کار، قبل از ذخیره، نوع فایل را انتخاب کنید - "همه فایل ها (*. *)").

این یک پیش نیاز نیست (چون می توانید نام صفحه اول را در تنظیمات سرور تغییر دهید)، بلکه یک قانون خوش سلیقه است. نام صفحه اول ترجیحاً فهرست (index.html) است، زیرا سرور هنگام دسترسی به آن، فایلی با همان نام - index صادر می کند.

اگر به درستی ذخیره شود، نماد فایل باید به نماد مرورگر (به طور پیش فرض اینترنت اکسپلورر) تغییر کند.

حالا این فایل را با notepad باز کنید و کد زیر را در آنجا کپی کنید.

این اولین صفحه وب است!



ذخیره و از طریق مرورگر باز کنید.

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

متن "این اولین صفحه وب است!" می توانید آن را به هر دیگری تغییر دهید، مانند این - "این اولین صفحه وب من است!!!". ذخیره کنید، مرورگر را به روز کنید، نتیجه را تحسین کنید.

اما صفحه ما هدر ندارد.



ما باید این را برطرف کنیم - کد را کمی تغییر می دهیم، یا بهتر است بگوییم، با استفاده از برچسب ها "سر سایت" را به آن اضافه می کنیم. و این اولین صفحه وب من است!!!



ذخیره کنید، به روز کنید، لذت ببرید. حالا صفحه ما یک هدر دارد.



توضیحات برچسب ها

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

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

برچسب بزنید ) برای تعیین عنوان صفحه مورد نیاز است. و این تگ باید فقط در داخل تگ قرار گیرد !

و آخرین، در کد ما، برچسب - . همچنین یک جفت تگ ( و

) که داخل آن کل قسمت قابل مشاهده سایت است، یعنی. متن، عکس، لینک، اطلاعات کلیکه می خواهید در سایت قرار دهید.

در درس بعدی در مورد انواع تگ ها و قوانین نوشتن آنها صحبت خواهیم کرد.





پرطرفدار در دسته بندی:



راهنمای Darkmoon Faire New Fashion Fish

خواندن



چگونه آنها در حراج Ebay دزدی می کنند: یادگیری خرید بدون ضرر تقلب در ...

خواندن



تلفن MGTS کار نمی کند: کجا تماس بگیرید

خواندن



برنامه های گوگل را نمی توان روی اندروید نصب کرد...

خواندن



آخرین مقالات



حالت امن موزیلا فایرفاکس

خواندن



مروری بر سرویس "درس های انگلیسی" از Beeline

خواندن



لپ تاپ یا کامپیوتر رومیزی کدام بهتر است

خواندن



بازیابی سیستم ویندوز

خواندن



چگونه برای GTA San Andreas سیو نصب کنیم؟

خواندن



دانلود mta برای نگاشت به samp

خواندن



Grand Theft Auto: معاون شهر شروع نمی شود؟

خواندن



منوی سمت چپ ansi را باز کنید. سفر از طریق ...

خواندن



5visa.ru
اینترنت. چند رسانه ای. ناوبر. تحصیلات. توسط. سیستم عامل. برنامه ها. مشاوره نصب و راه اندازی

• نسخه پروژه
• تبلیغات در وب سایت

• مخاطب
• نقشه سایت

© 2023 اینترنت. چند رسانه ای. ناوبر. تحصیلات. توسط. سیستم عامل. برنامه ها. مشاوره نصب و راه اندازی

بالا