ویژگی outline-style CSS
- صفحه قبل outline-offset
- صفحه بعدی outline-width
تعریف و استفاده
ویژگی outline-style برای تنظیم سبک کلی قلمرو عنصر استفاده می‌شود. سبک نمی‌تواند none باشد، در غیر این صورت قلمرو ظاهر نمی‌شود.
outline (پروفایل) خطی است که در اطراف عنصر کشیده می‌شود و در بیرون لبه‌های فریم قرار دارد و می‌تواند عنصر را برجسته کند. ویژگی outline لبه‌های اطراف عنصر را تنظیم می‌کند.
توجه:لطفاً همیشه ویژگی outline-style را قبل از outline-color مشخص کنید. عنصر باید اول پروفایل را دریافت کند تا بتواند رنگ پروفایل را تغییر دهد.
توجه:لبه‌های پروفایل فضا را اشغال نمی‌کنند و لزوماً مستطیل نیستند.
لطفاً به:
آموزش CSS:پیرامون CSS کانتور
دستورالعمل CSS:ویژگی outline
دستورالعمل HTML DOM:ویژگی outlineStyle
جملة CSS
outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
مقدار ویژگی
| مقدار | توضیح |
|---|---|
| none | پیش‌فرض. تعریف بدون لبه. |
| hidden | تعریف لبه‌های مخفی. |
| dotted | تعریف لبه‌های نقطه‌ای. |
| dashed | تعریف لبه‌های خطی. |
| solid | تعریف لبه‌های خطی. |
| double | تعریف لبه‌های دوخطی. عرض خطوط برابر با مقدار outline-width است. |
| groove | تعریف لبه‌های برجسته سه‌بعدی. این اثر بستگی به مقدار outline-color دارد. |
| ridge | تعریف لبه‌های برجسته سه‌بعدی. این اثر بستگی به مقدار outline-color دارد. |
| inset | تعریف لبه‌های برجسته سه‌بعدی. این اثر بستگی به مقدار outline-color دارد. |
| outset | تعریف لبه‌های برجسته سه‌بعدی. این اثر بستگی به مقدار outline-color دارد. |
| inherit | مشخص می‌کند که تنظیمات پروفایل باید از عنصر والد ارث‌بگیرند. |
جزئیات فنی
| مقدار پیش‌فرض: | none |
|---|---|
| ارث‌پذیری: | no |
| نسخه: | CSS2 |
| جمله‌بندی JavaScript: | object.style.outlineStyle="dotted" |
مثال عملی
- تنظیم سبک پروفایل
- این مثال نحوه تنظیم سبک پروفایل را نشان می‌دهد.
پشتیبانی مرورگر
اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که از این ویژگی پشتیبانی می‌کند.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
توجه:اگر !DOCTYPE مشخص شده باشد، IE8 از ویژگی outline پشتیبانی می‌کند.
- صفحه قبل outline-offset
- صفحه بعدی outline-width
