با سلام و عرض ادب خدمت شما همراهان همیشگی روکسو، در این قسمت از سری آموزشی صفر تا صد HTML میخواهیم در رابطه با ویژگی style صحبت کنیم. این ویژگی که در اصل مربوط به CSS است در نحوه ی نمایش محتوای HTML تاثیر دارد.
کلمه ی style در لغت به معنی «سبک» یا «طرح» یا همان «استایل» ای است که در فارسی نیز می گوییم. در واقع کار این تگ اعمال دستورات زبان CSS در کد های HTML است. ساختار کلی style به این شکل است:
در این ساختار، property یک خصوصیت CSS (مانند سایز فونت و …) است و value نیز مقداری که آن خصوصیت می گیرد (مانند 25px و …). در مورد این تگ در دوره ی آموزشی CSS به طور مفصل صحبت خواهیم کرد.
بهترین راه برای یادگیری این ویژگی استفاده از مثال های مختلف است بنابراین چندین مثال از آن را برایتان آماده کرده ایم.
خصوصیت background-color، یک رنگ پس زمینه را برای سند HTML ما و یا یکی از عناصر آن تعیین می کند. در مثال زیر رنگ پس زمینه ی سند HTML را به رنگ powderblue تنظیم کرده ایم. اگر نمی دانید این رنگ چیست می توانید در گوگل جست و جو کنید.
سوال: من از کجا بدانم چه رنگ هایی می توانم به عنوان value بگذارم؟
پاسخ: جواب این سوال طولانی است اما به صورت خلاصه بدانید که رنگ ها در CSS به دو صورت حرفی (مانند brown به معنی قهوه ای و ) و کُدی (مانند fff#) انتخاب می شوند. در دوره ی CSS با آن ها به طور کامل آشنا خواهیم شد اما برخی از این رنگ ها را به صورت خلاصه به شما معرفی می کنم.
| نام رنگ به صورت حرفی | کد HEX |
| Aqua | #00FFFF |
| Black | #000000 |
| CadetBlue | #5F9EA0 |
| Coral | #FF7F50 |
| Crimson | #DC143C |
| Cyan | #00FFFF |
| DarkOrange | #FF8C00 |
| DeepSkyBlue | #00BFFF |
| HotPink | #FF69B4 |
شما می توانید از هر کدام از این رنگ ها که خواستید استفاده کنید. در واقع تعداد این رنگ ها بیشتر از این ها است و جدول بالا تنها مشتی از خروار است! اگر دقت کرده باشید متوجه می شوید رنگ هایی که در جدول بالا آورده ایم هم نام دارند و هم کد. این یعنی در زبان CSS می توانید به جای کد هایشان از نام هایشان استفاده کنید (مانند "style="background-color:powderblue) اما بسیاری از رنگ هایی که ما می خواهیم دارای نام نیستند بنابراین تنها راه استفاده از آن ها تعیین رنگ به وسیله ی کد HEX است.
اگر نیاز به کد رنگ خاصی دارید، می توانید به وب سایت htmlcolorcodes.com یا امثال آن مراجعه کنید.
سوال: آیا رنگ ها فقط در کد HEX هستند؟
پاسخ: خیر رنگ ها در قالب های HSL و HSA و … نیز موجود هستند که در دوره ی CSS مورد بحث قرار خواهند گرفت.
خصوصیت color رنگ متن یک عنصر HTML را تعیین می کند. به مثال زیر توجه کنید:
خصوصیت font-family نوع فونت یک متن را انتخاب می کند. البته بر اساس نحوه ی استفاده، می توانید فونت کل سند HTML را نیز تغییر دهید. مثال: