CSS Borders
CSS Borders — Master CSS borders from basic lines to rounded corners, images, and creative effects. The guide walks through Border Basics, Border Styles, Border Radius, Outline vs Border. The border property is a shorthand for three individual properties: .border { border: 2px solid #333; } /* width | style | color */ .border { border: 1px solid #6366f1; } .border { border: 3px dashed #ef4444; } Individual sides: .box { border-top: 2px solid #4338ca; border-right: 2px solid #6366f1; border-bottom: 2px solid #818cf8; border-left: 2px solid #a5b4fc; } Individual… CSS offers a variety of border styles: .solid { border-style: solid; } /* Standard solid line */ .dashed { border-style: dashed; } /* Dashed line */ .dotted { border-style: dotted; } /* Dotted line */ .double { border-style: double; } /* Double line */ .groove { border-style: groove; } /* 3D grooved effect */ .ridge { border-style: ridge; } /*… The guide is organized into 4 sections that build on each other, each pairing a prose explanation with real CSS you can use as-is.