تگ style در HTML

نوشته شده توسط متین برونسی

منتشر شده در 1 ژوئن 2021

و آخرین بروزرسانی در 18 جولای 2021

دسته بندی ها:

HTML, فرانت اند

با استفاده از تگ style در HTML می توانید سبک های CSS خود را به سند اضافه کنید.

مثال

در مثال زیر با استفاده از تگ <style> یکسری دستورات CSS را که رنگ تگ <h1> و <p> را تغییر می دهد ایجاد کردیم:

<!DOCTYPE html>
<html dir="rtl">
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>

<h1>این یک عنوان برای صفحه است</h1>
<p>این یک پاراگراف است.</p>

</body>
</html>

تعریف و کاربرد

با تگ style در HTML کد ها و سبک های CSS را در سند اجرا میکنیم.

در داخل عنصر <style> با کد های CSS مشخص میکنیم که تگ ها و محتویات سند چگونه باید ارائه شوند.

نکته: با تگ <link> می توانید فایل های CSS خارجی خود را به سند پیوند داده و تغییرات خود را روی عناصر و محتوای سند ایجاد کنید.

پشتیبانی مرورگر ها

عنصر
`<style>`	بله	بله	بله	بله	بله

خواص

خاصیت	مقدار	توضیحات
media	media_query	مشخص می کند که منبع رسانه برای چه دستگاهی بهینه شده است ( واکنش گرایی صفحات وب )
type	text/css	نوع رسانه تگ `<style>` را مشخص می کند

خواص عمومی

تگ style از خواص عمومی در HTML پشتیبانی میکند.

رویداد های عمومی

تگ style از رویداد های عمومی در HTML پشتیبانی میکند.

تنظیمات پیش فرض CSS

اکثر مرورگر ها عنصر style در HTML را با تنظیمات پیش فرض زیر نمایش می دهند:

style {
  display: none;
}