html+css css横线怎么弄?
浏览量:2705
时间:2021-03-14 12:55:02
作者:admin
css横线怎么弄?
一、使用 hr 标签做横线
<div class="parent">
<p>我是一个段落</p>
<hr />
<p>我是也是个段落</p>
</div>
这里的代码使用一个 <hr /> 标签,将两个段落分割开
二、使用 border 边框做横线
.h{
border-bottom: 1px solid black
}
给元素添加 border 属性,设置边框只会,就可以做到一个横线
三、空元素设置 height,background
给一个空元素设置
height=1px,并且设置 background 背景色,也可以设置一个横线。
.space{
height: 1px
background-color: black
}
用CSS样式画横线的方法?
一般有两种方法:
一、通过CSS下划线代码:text-decoration:underline来设置文字下划线。
实例演示如下:
1、实例代码如下:
此时页面效果如下:
2、修改第1步中的txt样式,加入text-decoration:underline。
此时页面效果如下,出现了下划线。
二、通过设置div的border实现效果:
实例演示如下:
在第一种方法的初始代码上,增加border-bottom: 1px solid black、padding-bottom: 10px两个关键样式,如下:
此时页面效果如下:
html横线怎么设置?
html中定义横线使用<hr>标签,可以定义宽度和高度,分别是width和size属性!
版权声明:本文内容由互联网用户自发贡献,本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。