CSS – رنگ خطچین (Outline Color)
آخرین بروزرسانی:
CSS - رنگ خطچین (Outline Color)
ویژگی outline-color برای تنظیم رنگ خطچین استفاده میشود.
رنگ میتواند به روشهای زیر تنظیم شود:
- نام – با مشخص کردن نام رنگ، مانند “red”
- HEX – با مشخص کردن یک مقدار هگزادسیمال، مانند “#ff0000”
- RGB – با مشخص کردن یک مقدار RGB، مانند “rgb(255,0,0)”
- HSL – با مشخص کردن یک مقدار HSL، مانند “hsl(0, 100%, 50%)”
- invert – با انجام معکوس رنگ (این اطمینان را میدهد که خطچین قابل مشاهده باشد، بدون توجه به رنگ پسزمینه)
مثال:
در زیر چند خطچین با رنگهای مختلف نشان داده شده است. همچنین توجه داشته باشید که این عناصر همچنین دارای یک حاشیه مشکی نازک در داخل خطچین هستند:
- یک خطچین قرمز محکم
- یک خطچین آبی نقطهچین
- یک خطچین خاکستری با حالت outset
p.ex1 {
border: 2px solid black;
outline-style: solid;
outline-color: red;
}
p.ex2 {
border: 2px solid black;
outline-style: dotted;
outline-color: blue;
}
p.ex3 {
border: 2px solid black;
outline-style: outset;
outline-color: grey;
}
مقادیر HEX:
رنگ خطچین همچنین میتواند با استفاده از مقدار هگزادسیمال (HEX) مشخص شود:
p.ex1 {
outline-style: solid;
outline-color: #ff0000; /* قرمز */
}
مقادیر RGB:
یا با استفاده از مقادیر RGB:
p.ex1 {
outline-style: solid;
outline-color: rgb(255, 0, 0); /* قرمز */
}
مقادیر HSL:
همچنین میتوانید از مقادیر HSL استفاده کنید:
p.ex1 {
outline-style: solid;
outline-color: hsl(0, 100%, 50%); /* قرمز */
}
برای یادگیری بیشتر در مورد مقادیر HEX، RGB و HSL میتوانید به فصلهای مربوط به رنگها در CSS مراجعه کنید.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام