<html> <head> <style> div { padding: 8px; margin: 16px; } #basic { border: solid 1px; } #dotted { border: dotted 2px #999; } #override-top { border: solid 1px; border-top: dashed 2px blue; } #override-specific { border: solid 2px green; border-top-color: blue; border-bottom-width: 4px; } #with-radius { border: solid 2px green; border-radius: 8px; } </style> </head> <body> <div id="basic">This is a basic border</div> <div id="dotted">Here's a nice dotted border</div> <div id="override-top">You can specify different borders on each side</div> <div id="override-specific">You can override specific border properties</div> <div id="with-radius">A border radius sometimes looks nice!</div> </body> </html>