CSS Border
0 4038
The CSS Border properties allow you to specify how the border of the box representing an element should look.
CSS stands for Cascading Style Sheet.
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
.border1 {border-style: none;}
.border2 {border-style: solid; padding:5px; color:#CC0000}
.border3 {border-style: inset; padding:5px; color:#0033CC}
.border4 {border-style: dotted; padding:5px; color:#009966}
.border5 {border-style: double; padding:5px; color:#990099}
.border6 {border-style: groove; padding:5px; color:#336699}
.border7 {border-style: dashed; padding:5px; color:#003333}
.border8 {border-style: ridge; padding:5px; color:#33CCCC}
.border9 {border-style: outset; padding:5px; color:#669966}
.border10 {border-style: hidden; padding: 5px;}
</style>
</head>
<body>
<p class="border1"> Please put text here & see effect of border by CSS. </p>
<p class="border2"> Please put text here & see effect of border by CSS. </p>
<p class="border3"> Please put text here & see effect of border by CSS. </p>
<p class="border4"> Please put text here & see effect of border by CSS. </p>
<p class="border5"> Please put text here & see effect of border by CSS. </p>
<p class="border6"> Please put text here & see effect of border by CSS. </p>
<p class="border7"> Please put text here & see effect of border by CSS. </p>
<p class="border8"> Please put text here & see effect of border by CSS. </p>
<p class="border9"> Please put text here & see effect of CSS. </p>
</body>
</html>
Share:
Comments
Waiting for your comments