Share this Page URL

Chapter 16. The Box Model: Styles for Di... > The Box Revealed: Setting Borders - Pg. 185

The Box Model: Styles for Dimensions, Borders, Margins, and More <DIV STYLE="border-width: medium; border-style: groove"> This &lt;DIV&gt; uses a medium border with a groove style. </DIV> <DIV STYLE="border-width: thick; border-style: outset"> This &lt;DIV&gt; uses a thick border with a outset style. </DIV> <DIV STYLE="border-width: 1cm; border-style: inset"> This &lt;DIV&gt; uses a 1-centimeter border with an inset style. </DIV> <DIV STYLE="border-width: 10px; border-style: ridge"> This &lt;DIV&gt; uses a 10-pixel border with an ridge style. </DIV> </BODY> </HTML> 185 Figure 16.4. Internet Explorer trying some border styles on for size. Webmaster Wisdom If you want to format all the borders at once, here's a shorthand notation you can use: {border: border-width border-style border-color} Here, replace border-width, border-style, and border-color with values for each of those properties, like so: {border: thin solid Gray}