ویژگی border-style در CSS
ویژگی border-style، می تواند استایل حاشیه (border) را مشخص کند.
ویژگی border-style مقادیر مختلفی می پذیرد.
مقادیر | توضیحات |
dotted | یک حاشیه را به صورت نقطه چین تعریف می کند. |
dashed | یک حاشیه را به صورت خط چین تعریف می کند. |
solid | یک حاشیه ساده را می سازد. |
double | یک حاشیه دوتایی را تعریف می کند. |
groove | یک حاشیه شیار دار و سه بعدی را تعریف می کند. |
ridge | یک حاشیه ردیفی سه بعدی را می سازد. |
inset | یک حاشیه داخلی سه بعدی را تعریف می کند. |
outset | یک حاشیه خارجی سه بعدی را تعریف می کند. |
یک حاشیه پنهان را تعریف می کند. | |
none | حاشیه را از بین می برد. |
border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;
border-style: hidden;
border-style: none;
جهت های border-style در CSS
border-style: solid;
ویژگی border-style، در نمونه کد بالا، خلاصه ی چهار ویژگی است.
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
خلاصه نویسی border-style با یک مقدار در CSS
ویژگی border-style، را به چند صورت می توان خلاصه نویسی کرد.
ویژگی border-style با یک مقدار:
border-style: solid;
- در چهار جهت به صورت یکسان اعمال می شود.
خلاصه نویسی border-style با دو مقدار در CSS
ویژگی border-style با دو مقدار:
border-style: y x;
- مقدار اول در جهت بالا و پایین (محور y)
- مقدار دوم در جهت راست و چپ (محور x)
border-style: solid dotted;
خلاصه نویسی border-style با سه مقدار در CSS
ویژگی border-style با سه مقدار:
border-style: top x bottom;
- مقدار اول در جهت بالا
- مقدار دوم در جهت راست و چپ (محور x)
- مقدار سوم در جهت پایین
border-style: solid dotted dashed;
خلاصه نویسی border-style با چهار مقدار در CSS
ویژگی border-style با چهار مقدار:
border-style: top right bottom left;
- مقدار اول در جهت بالا
- مقدار دوم در جهت راست
- مقدار سوم در جهت پایین
- مقدار چهارم در جهت چپ
border-style: solid dotted dashed double;
خلاصه درس
در این درس با ویژگی border-style در CSS و مقادیر آن:
- مقدار dotted
- مقدار dashed
- مقدار solid
- مقدار double و...
آشنا شدیم.
توسعه دهندگان
احسان اسلامی