در اين بخش از
دوره آموزش HTML در آموزش دون
، با تگ
<style> آشنا مي‌شويم. اين تگ براي نوشتن CSS به صورت داخلي (Internal CSS) در صفحات HTML
استفاده مي‌شود و امکان استايل‌دهي به عناصر صفحه را فراهم مي‌کند.
تگ style در HTML چيست؟
تگ <style> داخل بخش <head> قرار مي‌گيرد و مي‌توان با آن قوانين CSS
براي المان‌هاي مختلف صفحه تعريف کرد.
اين روش براي صفحات کوچک يا نمونه‌هاي آزمايشي مناسب است و استايل‌ها به صورت مستقيم در همان فايل HTML نوشته
مي‌شوند.
مثال ساده از تگ style
<head>
<style>
p {
color: blue;
font-size: 18px;
}
</style>
</head>
<body>
<p>اين يک متن آبي با اندازه ?? پيکسل است.</p>
</body>
در اين مثال، تمام المان‌هاي <p> صفحه به رنگ آبي و با اندازه ?? پيکسل نمايش داده مي‌شوند.
ويژگي‌هاي مهم تگ style
| ويژگي | توضيح |
|---|---|
| type | نوع استايل (پيش‌فرض text/css) |
| media | مشخص کردن نوع رسانه (مثل screen، print) |
| scoped (منسوخ) | محدود کردن استايل‌ها به بخش والد (در HTML5 منسوخ شده) |
مثال با ويژگي media
<style media="print">
body {
color: black;
background-color: white;
}
</style>
با استفاده از ويژگي media مي‌توان استايل‌ها را براي چاپ يا نمايش در صفحه نمايش محدود کرد.
نکات مهم درباره style
- تگ
<style>بايد داخل<head>قرار گيرد. - براي صفحات بزرگ يا پروژه‌هاي حرفه‌اي، بهتر است از فايل CSS خارجي استفاده کنيد.
- مي‌توان ويژگي
mediaرا براي تعريف استايل‌هاي مخصوص چاپ يا نمايش موبايل استفاده کرد.
براي يادگيري کامل استايل‌دهي و طراحي صفحات وب، پيشنهاد مي‌کنيم در دوره آموزش HTML و CSS آموزش دون شرکت کنيد.
براي مشاهده تمام آموزش‌هاي HTML، به صفحه اصلي آموزش دون مراجعه کنيد.
آموزش قبلي: تگ strong در HTML
آموزش بعدي: تگ sub در HTML
دیدگاه و پرسش