1、最优画法,用display的inline-block;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS（层叠样式表）</title>
<style>
.a{
border-left: 5px solid #B7D0E4;
display: inline-block;
margin-left: -1px;
padding: 0px 0px 0px 3px;
}
</style>
</head>
<body>
<p class="a">
CSS（层叠样式表）层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML
（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
</p>
</body>
</html>效果图：
2、直接使用border.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS（层叠样式表）</title>
<style>
.a{
border-left: 3px solid red;
margin-left: -1px;
padding-left: 5px;
}
</style>
</head>
<body>
<p class="a">
CSS（层叠样式表）层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML
（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
</p>
</body>
</html>效果图：
以上就是css如何画竖线？的详细内容，更多请关注0133技术站其它相关文章！
