معرفی و کاربرد تگ style در HTML
معرفی و کاربرد تگ style در HTML استایل درون سند
در این مقاله از سایت آموزی جهت استفاده شما همراهان همیشگی به معرفی و کاربرد تگ <style> در HTML می پردازیم.
تگ <style> در اچ تی ام ال
تگ <style> برای تعریف اطلاعات استایل سند HTML سایت شما استفاده می شود.
در داخل تگ <style> مشخص می کنید که چگونه تگ های HTML باید در یک مرورگر نمایش داده شود.
هر سند HTML می تواند شامل چند تگ <style> باشد .
در حقیقت زمانی که شما می خواهید استایل دهی از نوع اینترنال ( Internal ) درون تگ <style> داشته باشید، بایستی از این تگ بهره ببرید.
تگ <style> را معمولا درون تگ head و یا داخل تگ body جهت استایل دهی دربین دیگر تگ های HTML به کار می برند.
تگ <style> مانند بسیاری از تگ های سند HTML دارای یک تگ باز <opening tag> و یک تگ بسته <closing tag> می باشد.
نکات مهم در مورد کاربرد تگ <style> در سند HTML
نکته ۳: برای لینک کردن به یک فایل CSS خارجی، از تگ link استفاده می کنیم.
نکته ۳: اگر خصوصیت scoped استفاده نشود، هر تگ <style> باید در قسمت تگ <head> سایت قرار گیرد.
مثال در مورد تگ <style> در اچ تی ام ال
[html]<html>
<head>
<style>
h2 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h2>A heading 1</h2>
<p>A paragraph.</p>
</body>
</html>[/html]
خروجی کد در مرورگر اینترنتی
This is a heading 2
This is a paragraph.
معرفی و کاربرد تگ style در HTML استایل درون سند
بررسی تگ <style> در HTML 4.01 و HTML5
خصوصیت scoped در HTML5 یک خصوصیت ویژه جدید است، که اجازه می دهد style ها برای بخش مشخصی از سند تعریف شود. اگر خصوصیتscoped وجود داشته باشد، آن styles فقط به عناصر style عنصر والد و عنصر فرزند اعمال می شود.
خصوصیات ویژه تگ <style> در HTML
ویژگی خصوصی تگ style | مقدار | کاربرد در سند style |
media | media_query | مشخص می کند که چه media یا دستگاهی برای منبع media مناسب است. |
scoped | scoped | یک خصوصیت جدید در HTML5 است و مشخص می کند که style ها فقط به عناصر style عنصر والد و عنصر فرزند اعمال می شود. |
type | text/css | نوع media در تگ style را مشخص می کند. |
جهت دیدن تمام ردیف و ستون ها در حالت موبایلی جدول را به چپ و راست اسکرول کنید.
ویژگی های عمومی تگ <style> در اچ تی ام ال
تگ <style> از کلیه ویژگی های عمومی در سند HTML پشتیبانی می کند.
رویدادهای عمومی تگ <style> در HTML
تگ <style> از کلیه رویدادهای عمومی در سند HTML پشتیبانی می کند.
برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور
برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت با HTML5 و CSS3 پروژه محور
پشتیبانی مرورگرها از تگ <style> در اچ تی ام ال
تگ <style> در همه مرورگرهای معتبر اینترنتی نظیر اینترنت اکسپلورر ، فایرفاکس ، اپرا ، گوگل کروم و سافاری پشتیبانی می شود.
پیوندهای مهم و کاربردی
تگ های جدید HTML5 در سایت آموزی
صفات تگ های HTML در سایت آموزی
تگ های منسوخ شده HTML5 در سایت آموزی
تگ های block level و inline level در سایت آموزی
معرفی و کاربرد تگ style در HTML استایل درون سند – اختصاصی سایت آموزی
درباره سایت آموزی
علیرضا ابراهیمی - بنیانگذار وبسایت آموزشی سایت آموزی ، 8 سال سابقه فعالیت حرفه ای در زمینه طراحی سایت ، سئو ، سابقه تدریس اغلب زبان های برنامه نویسی تحت وب ، محقق و تحلیلگر ساختارهای توسعه دهنده وب
نوشته های بیشتر از سایت آموزی
دیدگاهتان را بنویسید