Border style all values : border style : CSS Attributes and Javascript Style Properties HTML CSS TUTORIALS


HTML CSS TUTORIALS » CSS Attributes and Javascript Style Properties » border style »

 

Border style all values


 


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>A CSS Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style rel="stylesheet" type="text/css">
body {
  font-family: arial, verdana, sans-serif;
}

{
  border-color: #000000;
}

.none {
  border-style: none;
}

.solid {
  border-style: solid;
}

.dotted {
  border-style: dotted;
}

.dashed {
  border-style: dashed;
}

.double {
  border-style: double;
}

.groove {
  border-style: groove;
}

.ridge {
  border-style: ridge;
}

.inset {
  border-style: inset;
}

.outset {
  border-style: outset;
}

.hidden {
  border-style: hidden;
}
</style>
</head>

<body>
<p class="none">This paragraph has a border-style property set to none.</p>
<p class="solid">This paragraph has a border-style property set to solid.</p>
<p class="dotted">This paragraph has a border-style property set to dotted.</p>
<p class="dashed">This paragraph has a border-style property set to dashed.</p>
<p class="double">This paragraph has a border-style property set to double.</p>
<p class="groove">This paragraph has a border-style property set to groove.</p>
<p class="ridge">This paragraph has a border-style property set to ridge.</p>
<p class="inset">This paragraph has a border-style property set to inset.</p>
<p class="outset">This paragraph has a border-style property set to outset.</p>
<p class="hidden">This paragraph has a border-style property set to hidden.</p>
</body>
</html>

 



HTML code for linking to this page:

Follow Navioo On Twitter

HTML CSS TUTORIALS

 Navioo CSS Attributes and Javascript Style Properties
» border style