<!DOCTYPE>
<html>
<metacharset="utf-8">
<head>
<title>css常见边框样式<!DOCTYPE>
<html>
<metacharset="utf-8">
<head>
<title>css常见边框样式</title>
<style type="text/css">
.none {
color: #777;
border-bottom: 2px none #ddd;
}
.dotted {
color: #777;
border-bottom: 2px dotted #ddd;
}
.dashed {
color: #777;
border-bottom: 2px dashed #ddd;
}
.solid {
color: #777;
border-bottom: 2px solid #ddd;
}
.double {
color: #777;
border-bottom: 2px double #ddd;
}
.groove {
color: #777;
border-bottom: 2px groove #ddd;
}
.ridge {
color: #777;
border-bottom: 2px ridge #ddd;
}
.inset {
color: #777;
border-bottom: 2px inset #ddd;
}
.outset {
color: #777;
border-bottom: 2px outset #ddd;
}
.hidden {
color: #777;
border-bottom: 2px hidden #ddd;
}
</style>
</head>
<body>
<div class="none">无边框"none"</div>
<div class="dotted">点状边框"dotted"</div>
<div class="dashed">虚线边框"dashed"</div>
<div class="solid">实线边框"solid"</div>
<div class="double">双线边框"double"</div>
<div class="groove">3D凹槽边框"groove"</div>
<div class="ridge">3D垄状边框"ridge"</div>
<div class="inset">3Dinset边框"inset"</div>
<div class="outset">3Doutset边框"outset"</div>
<div class="hidden">隐藏边框"hidden"</div>
</body>
</html>
发表评论