یک برگه سبک (Style Sheet) مجموعه‌ای از قوانین یا دستورالعمل‌ها است که استفاده می‌شود تا ظاهر و تنظیمات ظاهری اجزای یک صفحه وب را تعیین کند. این قوانین معمولاً شامل استایل‌های CSS (شیوه‌نامه‌های وب) می‌شود که تعیین می‌کنند چگونگی نمایش المان‌های HTML در صفحه است.
توضیحات جزئی:
-
انواع Style Sheet:
- Inline Styles: استایل‌های CSS که به صورت مستقیم در تگ‌های HTML تعریف می‌شوند.
- Internal Styles: استایل‌های CSS که درون بخش
<style>درون تگ<head>صفحه قرار می‌گیرد. - External Styles: استایل‌های CSS که در فایل مجزا به صورت خارجی ایجاد می‌شوند و با استفاده از تگ
<link>به صفحه وابسته می‌شوند.
-
انتخاب‌گرها (Selectors):
- استفاده از انتخاب‌گرها برای انتخاب المان‌های HTML مورد نظر جهت اعمال استایل‌ها.
- انواع مختلف انتخاب‌گرها شامل انتخاب‌گرهای عنصری، کلاس، آیدی، تگ و …
-
ویژگی‌ها (Properties):
- ویژگی‌ها CSS مشخص می‌کنند چگونگی نمایش یک المان HTML است.
- به عنوان مثال، ویژگی‌های مانند رنگ، اندازه، فاصله، ترتیب و …
-
مقادیر (Values):
- مقادیر CSS مقادیری هستند که به ویژگی‌ها اختصاص داده می‌شوند و تاثیر مستقیمی بر ظاهر المان‌ها دارند.
- به عنوان مثال، مقادیر مختلف رنگ، اندازه‌ها و …
مثال:
یک مثال ساده از یک برگه سبک داخلی (Internal Style Sheet) به صورت زیر است:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>صفحه با استفاده از برگه سبک</title>
<style>
/* انتخاب عنصر h1 و تعیین ویژگی‌ها */
h1 {
color: blue;
font-family: Arial, sans-serif;
}
/* انتخاب المان با کلاس "intro" و تعیین ویژگی‌ها */
.intro {
font-size: 18px;
line-height: 1.5;
}
</style>
</head>
<body>
<!-- استفاده از المان‌های HTML با استفاده از استایل‌های تعیین شده -->
<h1>سلام دنیا!</h1>
<p class="intro">این یک مثال از استفاده از برگه سبک در HTML است.</p>
</body>
</html>
در این مثال، ما یک برگه سبک داخلی داریم که استایل‌ها برای عناصر <h1> و .intro تعریف شده‌اند. این استایل‌ها بر روی صفحه تاثیر می‌گذارند و ظاهر آنها را تغییر می‌دهند.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام