بهترین سایت برای توسعه دهندگان وب

دروس HTML5

شروع HTML مقدمه HTML ویرایشگران HTML مثالهای اساسی HTML المان های HTML ویژگی های HTML عناوین HTML بندهای HTML سبک های HTML قالب بندی HTML نقل قول های HTML نظرات HTML رنگهای HTML HTML و CSS پیوندهای HTML تصاویر HTML جداول HTML لیست های HTML بلوک های HTML کلاس های HTML شناسه های HTML فریم های HTML HTML و JavaScript مسیرهای پرونده HTML HTML قسمت هدینگ چیدمان های HTML HTML پاسخگو کد رایانه HTML موجودیت HTML نمادهای HTML رمزگذاری HTML رمزگذاری URL HTML HTML و XHTML

HTML فرم ها

فرم های HTML عناصر فرم HTML انواع ورودی HTML صفات ورودی HTML

HTML5

مقدمه HTML5 پشتیبانی HTML5 عناصر جدید HTML5 عناصر معنایی HTML5 مهاجرت از HTML4 راهنمای سبک HTML5

HTML گرافیک

HTML Canvas HTML SVG

HTML رسانه

HTML ویدیوی HTML صوت HTML افزونه های HTML یوتیوب HTML

HTML API

مکان جغرافیایی HTML کشیدن / رها کردن HTML HTML ذخیره وب HTML کارهای وب HTML و SSE

HTML مثال

مثالهای HTML آزمون ها HTML تمرینات HTML گواهی HTML خلاصه HTML قابلیت دسترسی به HTML

HTML منابع

لیست برچسب های HTML صفات HTML صفات جهانی HTML رویدادهای HTML رنگهای HTML کانواس HTML صوتی / تصویری HTML نسخه معتبر HTML مجموعه نویسه های HTML رمزگذاری URL HTML رمزگذاری زبان HTML پیام های HTTP روشهای HTTP مبدل PX به EM میانبرهای صفحه کلید

HTML5 درسهایی برای مبتدیان

ویژگی های HTML



ویژگی ها اطلاعات بیشتری در مورد المان های HTML ارائه می دهند.

ویژگی های HTML

ویژگی HTML

  • همه المان ها HTML می توانند دارای ویژگی های باشند
  • ویژگی ها اطلاعات اضافی در مورد یک المان را ارائه می دهند
  • ویژگی ها همیشه در برچسب شروع مشخص می شوند
  • ویژگی ها معمولاً با نام / مقدار نوشته می شوند ، به عنوان مثال:نام ="مقدار"

ویژگی Href

پیوندهای HTML با استفاده از برچسب <a>تعریف می شوند ... آدرس پیوند درhref مشخص می شود:

مثال

<a href="https://www.farsiw3.ir">این یک پیوند است</a>
خودتان آزمایش کنید »

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


ویژگی Src

تصاویر HTML با استفاده از برچسب <img> تعریف می شوند .

نام منبع تصویر در ویژگی src مشخص شده است:

مثال

<img src="img_girl.jpg">
خودتان آزمایش کنید »

ویژگی های عرض و ارتفاع

 تصاویر HTML دارای ویژگی هایی نیز هستند width (عرض) و height (ارتفاع)که عرض و ارتفاع تصویر را تعریف می کنند:

مثال

<img src="img_girl.jpg" width="500" height="600">
خودتان آزمایش کنید»

عرض و ارتفاع به طور پیش فرض در پیکسل مشخص می شوند. بنابراین width="500" به معنای عرض 500 پیکسل است

درباره تصاویر در فصل بعدی بیشتر خواهید آموخت تصاویر HTML.


ویژگی Alt

ویژگی alt متن جایگزین را مشخص می کند ، اگر تصویر قابل نمایش نیست متن دلخواه شما نمایش داده خواهد شد.

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

برای سئو سایت بسیار مفید است که " موتور های جستجو " راحتتر آن ها را پیدا می کنند ویژگی alt یکی از مهمترین بخش های سئو سایت به حساب می آید

مثال

<img src="img_girl.jpg" alt="دختر با ژاکت ">
خودتان آزمایش کنید»

ویژگی alt همچنین در صورت عدم امکان نمایش تصویر مفید است. (به عنوان مثال ، اگر در سایت عکس بصورت ناگهانی پاک شده باشد ):

مثال

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

<img src="img_typo.jpg" alt=" دختر با ژاکت ">
خودتان آزمایش کنید»

ویژگی سبک یا همان استایل

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

مثال

<p style="color:red">این یک پاراگراف است.</p>
خودتان آزمایش کنید »

ویژگی زبان

زبان سند را می توان در برچسب <html>اعلام کرد.

زبان وب سایت را می توان با ویژگیlang اعلام کرد .

اعلام زبان برای برنامه های غنی (خوانندگان صفحه) و موتورهای جستجو مهم است :

<!DOCTYPE html>
<html lang="en-US">
<body>

...

</body>
</html>

دو حرف اول زبان (en) را نشان می دهد. اگر گویشی وجود دارد ، دو حرف دیگر را هم اضافه کنید ( us ، ایالات متحده آمریکا). "en-US" . این یعنی سایت انگلیسی هست اما با گویش آمریکایی

برای فارسی کافیست بنویسید fa که دو حرف اول farsi است


ویژگی عنوان

ویژگی عنوان به المان اضافه می شود<p>.مقدار ویژگی عنوان به عنوان یک پنجره بازشو نمایش داده می شود که نکاتی هنگام قرار گرفتن در بالای یک پاراگراف (paragraph) را نشان می دهد :

مثال

<p title="من یک راهنما هستم">
این یک پاراگراف است.
</p>
خودتان آزمایش کنید »

استفاده از ویژگی های المان

در استاندارد HTML5 لازم نیست ویژگی ها با حروف کوچک یا بزرگ نوشته شده باشند

به عنوان مثال ویژگی عنوان را می توان با حروف بزرگ یا کوچک نوشت title یا TITLE.

W3C استفاده از حروف کوچک را در HTML توصیه می کند XHTML کمی سختگیرانه تر است

Farsiw3 همیشه از نام ویژگی های کوچک استفاده می کند.


ما پیشنهاد می کنیم: مقادیر ویژگی را در نقل قول قرار دهید

استاندارد HTML5 به علامت نقل قول در اطراف مقادیر ویژگی نیاز ندارد.

ویژگی hrefکه در بالا نشان داده شده است بدون علامت نقل قول هم می توند نوشته شود:

علامت نقل قول را انگلیسی باید بنویسید که این شکلی هستند " " و در وسط آنها مقدار ویژگی می آید

ضعیف

<a href=https://www.farsiw3.ir>
خودتان آزمایش کنید »

خوب

<a href="https://www.farsiw3.ir">
خودتان آزمایش کنید »

W3C علامت نقل قول را در HTML توصیه می کند و برای انواع سخت تر به نقل قول نیاز است اسنادی مانند XHTML.

گاهی اوقات استفاده از علامت های نقل قول ضروری است این مثال درست نخواهد بود نمایش دادن ویژگی عنوان شامل یک فاصله است:

مثال

<p title=در مورد Farsiw3>
خودتان آزمایش کنید »

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


نقل قول های یک ' ' یا دو " " شکله؟

نقل قول های دوگانه" " در مورد مقادیر ویژگی در HTML بیشتر رایج است ، اما شما همچنین می توانید از نقل قول های منفرد ' ' نیز استفاده کنید.

در بعضی شرایط ، وقتی مقدار ویژگی خود شامل دو نقل قول باشد ، استفاده از نقل قول های منفرد ضروری است :

<p title='احمد "هدیه داد" به برادرش'>

یا برعکس

<p title="احمد 'هدیه داد' به برادرش">
خودتان آزمایش کنید »

خلاصه بخش

  • همه المان های HTML می توانند ویژگی داشته باشند
  • ویژگی title اطلاعات اضافی را در فرم "راهنمای ابزار"ارائه می دهد
  • ویژگی href اطلاعات آدرس را برای پیوندها فراهم می کند
  • ویژگی width و height اطلاعات عرض و طول را نشان می دهند
  • ویژگی alt متنی را برای خوانندگان صفحه نمایش فراهم می کند
  • farsiw3 همیشه از مقادیر صفت کوچک (کوچک) استفاده می کند
  • farsiw3 همیشه مقادیر ویژگی را در نقل قول می گذارد

تمرینات HTML

خود را امتحان کنید

یک تمرین:

با عنوان "درباره Farsiw3" یک "نکته ابزار" به مورد زیر اضافه کنید:

<p ="درباره Farsiw3">farsiw3 یک وب سایت برای وب نویسان هست</p>

تمرین را شروع کنید


ویژگی های HTML

در زیر لیست الفبای برخی از ویژگی هایی که معمولاً در HTML استفاده می شود و با آنها آشنا خواهید شد را مشاهده می کنید:

توضیح ویژگی
متن متناوب را برای تصویر مشخص می کند ، درصورتی که تصویر قابل نمایش نباشد alt
نشان می دهد که المان ورودی باید غیرفعال شود disabled
آدرس اینترنتی (آدرس وب) را برای پیوند مشخص می کند href
شناسه منحصر به فرد برای یک مورد مشخص می کند id
URL (آدرس وب) تصویر را مشخص می کند src
سبک CSS درون خطی را برای یک المان مشخص می کند style
اطلاعات اضافی را در مورد یک المان تعریف می کند (به عنوان یک راهنمای ابزار نمایش داده می شود) title

برای لیست کاملی از تمام ویژگی ها برای هر المان HTML ، به: مرجع ویژگی HTML رجوع کنید.






این سایت برای آموزش ، آزمایش و یادگیری بهینه شده است. نمونه ها را می توان برای بهبود ساده کرد خواندن و درک اساسی. آموزشها ، پیوندها و مثالها مرتباً تجدید نظر می شوند تا از آنها جلوگیری شود خطاها ، اما ما نمی توانیم صحت و عملکرد کامل همه مطالب را تضمین کنیم. با استفاده از این سایت ، شما موافقت می کنید که مطالعه کرده اید و پذیرفته ایدمقررات استفاده , کوکی و سیاست های حفظ حریم خصوصی. کپی رایت 1999-2020 حق چاپ و .. محفوظ توسط احمد فرجی
سایت توسط چارچوب farsiw3.ir طراحی شده است.

Farsiw3.ir