1.使用html中的border属性来设置一条水平线
<div style="width:500px border:1px solid red"></div><!--复制到html文件中就会是一条红色水平直线，线的颜色、长短、可自己调节-->2.使用hr标签可以制作一条水平直线
<hr/>
3.使用background-color来制作一条线，和border基本类似
<div style="width:500px height:1pxbackground-color:red"></div><!--复制到html文件中就会是一条红色水平直线，线的颜色、长短、可自己调节-->4.可利用背景图来实现和background-color原理一样
<div style="width:500px height:1pxbackground:url(背景图的路径) repeat-x"></div><!--复制到html文件中就会是一条红色水平直线，线的颜色、长短、可自己调节-->在html中花一条线的方法是有很多的，一般可以直接使用html代码实现或者借助css代码来实现都是可以的。
方法1、使用<hr>标签画线
<html><body>
<p>hr 标签定义水平线：</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
</body>
</html>
结果如下：
方法2：使用css的border进行画线
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title>float</title>
</head>
<div id="div1"></div>
<style>
#div1{
width: 500px
border-bottom: 1px solid red
}
</style>
</html>
结果如下：
在HTML中，设置水平线高度，有两个标签border和height，用法如下：
用border属性来设置一条水平线，如代码：
<div style="width:500px border:1px solid red"></div><!--注：border 这里指水平线高度！-->
使用background-color来制作一条线，和border基本类似，如代码
<div style="width:500px height:1pxbackground-color:red"></div><!--注：height:1px 这里指水平线高度！-->
使用hr标签可以制作一条水平直线，如代码：
<hr/><!--这个标签的涵义就是一条水平的直线，但是不灵活，现在基本没人使用！-->
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）