HTML and CSS Reference
In-Depth Information
Element borders are created by using one or more of the border properties
to set values for the width, color, and style of the border. he border-width
property can take any nonnegative numeric value or one of the keywords thin ,
medium , thick , or inherit , with medium as the default value. he permissible
values for the border-style property are none , hidden , solid , dotted , dashed ,
double , ridge , groove , inset , outset , and inherit . he default for all HTML
elements is a border with a style of none. herefore, an element must have its
border-style property set to some other value for a border to appear. Older
browsers may not support all values. Example 3.14 illustrates the use of a table
to display the diferent border style values. Figure 3.14 shows how this code
appears in a typical browser.
Example 3.14: Using a table to display border styles
<!DOCTYPE html>
<title>Example 3.14</title>
<style type="text/css">
body { font: bold 9pt Tahoma,Verdana,sans-serif; }
td { border-width: 5px; padding: 1em; background-color: #ddd; }
td:before { content: attr(style); } /* insert style content */
<table border="0" width="100%" cellspacing="8">
<td style="border-style: none"></td>
<td style="border-style: hidden"></td>
<td style="border-style: solid"></td>
<td style="border-style: dotted"></td>
<td style="border-style: dashed"></td>
<td style="border-style: double"></td>
<td style="border-style: ridge"></td>
<td style="border-style: groove"></td>
Search WWH ::

Custom Search