HTML设置水平分割线

在Web中使用水平分割线能够分割不一样的文字段落或者其它网页组件,轻松地修饰了段落排版,使之更美观。固然,水平分割线还能够更加明显地突出某一段重要的文字,使之更加醒目。web

使用<hr>标签能够轻松地设置一条水平线。方法以下:浏览器


HTML设置水平分割线

1. HTML设置一条水平分割线

<hr />

这是水平分割线的最基本应用。它是居中对齐的。spa

2. HTML设置水平分割线的宽度

<hr width="200" />

水平分割线的宽度为像素(px)或者相对于屏幕宽度的百分比(%)。好比:code

<hr width="200px" /> <!--单位为像素。默认值是将px去掉,成为上面的格式-->
<hr width="20%" />   <!--单位是相对于屏幕宽度的百分比-->

3. HTML设置水平分割线的粗细

<hr size="30" />

水平分割线的粗细单位仍然是像素(px)。orm

4. HTML去掉水平分割线的阴影

<hr noshade="noshade" />

通常状况下,水平分割线是带有阴影的,具体显示为一条突出的或者凹下去的线条。使用此属性,能够去掉分割线的阴影,使之成为一条无阴影效果的实心线。it

5. HTML设置水平分割线的对齐方式

<hr width="30%" align="left" />

水平分割线的对齐方式默认为居中对齐。使用align属性能够改变它的对齐方式。而且只有当它的宽度设置小于屏幕的宽度时,才会显示出对齐方式的设置效果。webkit

6. HTML设置水平分割线的颜色

<hr color="#FF0000" />

能够给水平分割线设置不一样的颜色。方法

7. HTML设置水平分割线的title属性

<hr size="30" title="设置水平分割线的title属性" />

当浏览者将鼠标悬停在分割线上时会出现属性值设置的提示内容。im

8. HTML水平分割线的综合应用

<hr width="300" size="20" noshade="noshade" align="right" color="#0000FF" />

能够分别设置<hr />的属性:size、width、align、color和noshade等。属性不用所有设置,而是根据须要选择某些属性进行设置,未设置的属性浏览器会以默认的方式显示。样式

  • 默认方式:浏览器在遇到属性不全的标签时,对于未设置的属性将根据浏览器内部定义好的样式进行显示。

相关文章
相关标签/搜索