مبانی CSS · ۸ دقیقه مطالعه

حاشیه، گوشهٔ گرد و سایه

حاشیه (border)

border: 2px solid #22d3ee;
border-bottom: 1px dashed #999;

انواع: solid, dashed, dotted.

border-radius: 12px;
border-radius: 50%;   /* دایره */

شبیه border ولی در فضا جا نمی‌گیرد (برای حالت focus عالی):

button:focus { outline: 2px solid #22d3ee; }

box-shadow: 0 10px 30px rgba(0,0,0,.2);
/*            x  y  blur  رنگ */

سایهٔ متن هم داریم:

text-shadow: 0 2px 8px rgba(34,211,238,.5);

سایه و گوشهٔ گرد، حس مدرن و «کارت‌مانند» می‌دهند.