آموزش تگ style در HTML
تگ <style> در HTML اجازه می‌دهد تا قوانین استایل CSS را مستقیماً در داخل سند HTML قرار دهید. این تگ معمولاً در قسمت <head> اسناد HTML قرار می‌گیرد و از آن برای تعیین استایل‌های ظاهری مانند رنگ‌ها، فونت‌ها، اندازه‌ها و … استفاده می‌شود. در این مقاله، با توضیح این تگ به طور کامل آشنا می‌شویم و نحوه استفاده از آن را با مثال‌هایی نشان می‌دهیم.
1. تگ style در HTML
تگ <style> یک تگ بدون بسته شدن است که برای تعیین قوانین استایل CSS درون خود استفاده می‌شود.
2. ویژگی‌های تگ style
تگ <style> دارای ویژگی‌های زیر است:
- type: نوع محتوای تگ (معمولاً
text/css).
3. نحوه استفاده از تگ style
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Style Tag Example</title>
<style type="text/css">
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
color: #333;
}
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>Hello, World!</h1>
<p>This is a paragraph with some text.</p>
</body>
</html>4. ویژگی‌های عمومی
تگ <style> می‌تواند دارای ویژگی‌های دیگری مانند media، scoped، و … باشد که به کنترل نحوه اعمال قوانین استایل و ارتباط آن‌ها با محتوای صفحه کمک می‌کنند.
5. مثال کاربردی
<style type="text/css" media="screen">
p {
font-size: 16px;
line-height: 1.5;
}
</style>6. کاربردها
- استایل‌دهی مستقیم: استفاده از تگ
<style>برای تعیین استایل‌های مستقیم در داخل صفحه HTML به جای ایجاد یک فایل CSS جداگانه. - استایل‌دهی موقتی: برای استایل دهی به المان‌ها به طور موقت و یا در صفحاتی که به سرعت نیاز به تغییرات دارند، استفاده می‌شود.
تگ <style> یکی از ابزارهای مهم برای اعمال استایل‌های CSS در داخل صفحات HTML است. با استفاده از این تگ، می‌توانید استایل‌های ظاهری را به صفحات خود اعمال کنید و ظاهر وبسایت خود را بهبود دهید.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام