ویژگی border-radius در CSS
ویژگی border-radius، برای انحنا دادن به حاشیه (border) استفاده می شود.
ویژگی border-radius، مقدار عددی دریافت می کند.
border-radius: 15px;border-radius: 5px;جهت های border-radius در CSS
border-radius: 10px;ویژگی border، در نمونه کد بالا، خلاصه ی چهار ویژگی است.
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;خلاصه نویسی border-radius با یک مقدار
ویژگی border-radius را می توان به چند صورت خلاصه نویسی کرد.
ویژگی border-radius با یک مقدار:
border-radius: 5px;- در چهار گوشه به صورت یکسان اعمال می شود.
خلاصه نویسی border-radius با دو مقدار
ویژگی border-radius با دو مقدار:
border-radius: (top-left/bottom-right) (top-right/bottom-left);- مقدار اول در گوشه بالا-چپ و پایین-راست
- مقدار دوم در گوشه بالا-راست و پایین-چپ
border-radius: 10px 30px;خلاصه نویسی border-radius با سه مقدار
ویژگی border-radius با سه مقدار:
border-radius: top-left (top-right/bottom-left) bottom-right;- مقدار اول در گوشه بالا-چپ
- مقدار دوم در گوشه بالا-راست و پایین-چپ
- مقدار سوم در گوشه پایین-راست
border-radius: 10px 20px 30px;خلاصه نویسی border-radius با چهار مقدار
ویژگی border-radius با چهار مقدار:
border-radius: top-left top-right bottom-right bottom-left;- مقدار اول در گوشه بالا-چپ
- مقدار دوم در گوشه بالا-راست
- مقدار سوم در گوشه پایین-راست
- مقدار چهارم در گوشه پایین-چپ
border-radius: 5px 10px 15px 20px;خلاصه درس
در این درس با ویژگی border-radius در CSS:
- انواع مقداردهی
- خلاصه نویسی آن با مقدارهای مختلف
آشنا شدیم.
توسعه دهندگان
احسان اسلامی
