html中hr的各种样式使用

html-css016

html中hr的各种样式使用,第1张

HTML的hr标签可以创建一条水平线。下面,我们来看看html中hr的各种样式使用吧。

01

创建一条水平线

先使用<hr/>标签来创建一条水平线,如下图所示:

02

hr的高度

使用style来设置hr水平线的样式,比如设置hr的高度, <hr style=" height:30px" />。如下图所示:

03

没有边框

使用border:none来设置hr没有边框,如下图所示:

04

dotted 虚线

使用dotted将水平线设置成虚线,如下图所示:

<HR>(水平线)标签用于在页面上绘制水平线。此标签只有开始标签,没有结束标签,可使用属性控制水平线的显示。如:

<HR>标签属性

属性 说明

ALIGN 指定流水线的位置,可以将水平线居中对齐、右对齐或左对齐。如:align=center

WIDTH 指定水平线的长度。可以按像素或百分比为单位指定其长度。默认值为100%,

即横穿整个文档

SIZE 指定水平线的宽度,以像素为单位

NOSHADE 指定水平线以纯色而不是以阴影进行显示

定义和用法

<hr>标签在 HTML 页面中创建一条水平线。

水平分隔线(horizontal rule)可以在视觉上将文档分隔成各个部分。

实例

被水平线分隔的标题和段落:

<h1>This is header 1</h1>

<hr />

<p>This is some text</p>

TIY

浏览器支持

所有主流浏览器都支持 <hr>标签。

HTML 与 XHTML 之间的差异

在 HTML 中,<hr>标签没有结束标签。

在 XHTML 中,<hr>必须被正确地关闭,比如 <hr />。

在 HTML 4.01 中,hr 元素的所有呈现属性均不被赞成使用。

在 XHTML 1.0 Strict DTD 中,hr 元素的所有呈现属性均不被支持。

更多请参考 http://www.w3school.com.cn/tags/tag_hr.asp