本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。
在html中实现画一条心的效果的方法是有很多种的,最简单的就是使用<hr>标签或者css中border属性。
一、使用border实现画一条线的效果
1、可以给一个一定宽度的元素设置一个border-bottom属性,让其只有一个底边框,进而实现一条线的效果,代码如下:
<div id="div1"> </div> <style> #div1{ margin-top: 100px; width: 900px; border-bottom: 1px solid #000000; } </style>
登录后复制
2、运行效果如下:
二、使用hr标签实现画一条线
1、使用hr标签实现画一条线效果,代码如下:
<html> <body> <p>hr 标签定义水平线:</p> <hr /> <p>这是段落。</p> <hr /> <p>这是段落。</p> <hr /> <p>这是段落。</p> </body> </html>
登录后复制
2、运行效果如下:
推荐学习:css视频教程
以上就是css如何画线的详细内容,更多请关注Work网其它相关文章!