این آموزش در تاریخ ۱۴۰۲/۰۶/۱۹ آپدیت شده است.
آموزش صفت عمومی style در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش صفت عمومی style در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
صفت عمومی style در HTML
صفت style صفتی است که ما با استفاده از آن میتوانیم برای تگ های HTML بصورت خطی یا اینلاین یا درون تگی استایل تعریف نماییم. این صفت از صفت های پرکاربرد زبان HTML می باشد.
همونطور که میدانید ما روش های مختلفی برای استفاده از دستورات CSS در عناصر یا تگ های HTML داریم که یکی از این روش ها همین استفاده از صفت style می باشد.
استفاده بیش از اندازه و زیاده روی در این روش اصلا توصیه نمی شود، چرا که باعث کم شدن سرعت بارگذاری صفحه می شود، لذا سعی کنید زیاده روی نکنید، و سعی کنید از CSS روش داخلی یا خارجی استفاده نمایید.
برای مثال من با استفاده از صفت style موارد زیر را ایجاد کرده ام : که در واقع از دستورات CSS باید درون این صفت استفاده کرد.
سایت آموزشی فری لرن
سایت آموزشی فری لرن
سایت آموزشی فری لرن
Free-Learn
مثال از صفت style در HTML
در ادامه میتوانید یک مثال از این صفت را مشاهده نمایید.
|
1 2 3 4 5 |
<body> <p style="background-color:#123456; color:#fff; padding:10px; text-align:center;">سایت آموزشی فری لرن</p> </body> |
مثال شماره ۲ : تنظیم تصویر زمینه ( استفاده از صفت style در تگ body )
|
1 2 3 4 5 |
<body style="background-image:url(files/bg-1.jpg);"> <h2>سایت آموزشی فری لرن</h2> </body> |
مثال شماره ۳ : تمامی متن های داخل صفحه وسط قرار بگیرن و رنگ زمینه مشکی و رنگ متن سفید
|
1 2 3 4 5 |
<body style="background-color:#000; color:#fff; text-align:center;"> <h2>سایت آموزشی فری لرن</h2> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از صفت style در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
روش استفاده
روش استفاده از این صفت در عناصر HTML بصورت زیر می باشد.
|
1 |
<element style="Style_CSS"> |
Free-Learn
جدول مقادیر صفت style
در جدول زیر میتوانید مقادیر را که میتوان در این صفت استفاده کرد را مشاهده نمایید.
| مقدار | توضیح |
| Style_CSS | دستورات CSS در این قسمت قرار میگیرد |
Free-Learn
نکات و توضیحات
- سعی کنید زیاد از این صفت در تگ هاتون استفاده نکنید، چون مثلا ممکنه بعدا بخواید کدی رو تغییر بدید، هیچی دیگه باید تک به تک تگ هارو ویرایش کنید، بهمین خاطر بهتره از روش داخلی CSS استفاده نمایید. ( مثال )
