<!DOCTYPE html>
<html>
<head>
<meta charset=
"UTF-8"
>
<title>css 文字下划线样式</title>
<style>
.demo{
width: 400px;
height: 400px;
margin:100px auto;
}
.demo1 span{
border-bottom: 1px solid #000000;
}
.demo2 span{
border-bottom: 5px solid #0081EF;
}
.demo3 span{
border-bottom: 2px dashed #000000;
}
.demo4 span{
border-bottom: 2px dotted #000000;
}
.demo5 span{
border-bottom: 5px double #000000;
}
</style>
</head>
<body>
<div
class
=
"demo"
>
<p
class
=
"demo1"
>这是第1段测试文字,<span>php中文网</span>!</p>
<p
class
=
"demo2"
>这是第2段测试文字,<span>php中文网</span>!</p>
<p
class
=
"demo3"
>这是第3段测试文字,<span>php中文网</span>!</p>
<p
class
=
"demo4"
>这是第4段测试文字,<span>php中文网</span>!</p>
<p
class
=
"demo5"
>这是第5段测试文字,<span>php中文网</span>!</p>
</div>
</body>
</html>