Home > Article > Web Front-end > How to draw lines in css
How to draw lines in css
- 藏色散人Original
- 2021-04-13 09:40:5310060browse
How to draw a line in css: 1. Use the border attribute to achieve the effect of drawing a line, with code such as "border-bottom: 1px solid #000000;"; 2. Use the hr tag to achieve the effect of drawing a line.
The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.
There are many ways to achieve the effect of drawing a heart in HTML. The simplest is to use the
tag or the border attribute in CSS.
1. Use border to achieve the effect of drawing a line
1. You can set a border-bottom attribute to an element of a certain width so that it has only one bottom border, thereby achieving the effect of drawing a line. The effect, the code is as follows:
<div id="div1">
</div>
<style>
#div1{
margin-top: 100px;
width: 900px;
border-bottom: 1px solid #000000;
}
</style>2. The running effect is as follows:
2. Use the hr tag to draw a line
1. Use the hr tag to achieve the effect of drawing a line. The code is as follows:
<html>
<body>
<p>hr 标签定义水平线：</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
</body>
</html>2. The running effect is as follows:
Recommended learning: css video tutorial
The above is the detailed content of How to draw lines in css. For more information, please follow other related articles on the PHP Chinese website!