css中<hr>有什么效果

html-css0148

css中<hr>有什么效果,第1张

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

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

至于CSS,如果不针对HR标签书写CSS样式,那就只是一条黑色水平线。

CSS可以定义更漂亮的分割线。例如颜色描边背景边距等。

<hr>在chrome中默认是左对齐。在IE中默认是居中对齐,要想左对齐css中用text-align:left。

<hr style="text-align:left">或 <hr align="left">

<hr>的颜色设置

<hr style="border:0background-color:#ff0000height:1px">

如果不加border:0的话,虽然颜色改变了,但是会显示一条黑色的边框。如果不加height:1px的话,在chrome会显示不出来。

如何使用CSS更改hr标签的厚度?下面本篇文章就来给大家介绍一下使用CSS更改hr标签的厚度的方法,希望对大家有所帮助。

HTML <hr>标签在 HTML 页面中创建一条水平线;水平分隔线(horizontal rule)可以在视觉上将文档分隔成各个部分。

<hr>标签的厚度可以使用CSS中的height属性设置;最小高度可以是1px,因为可用的最小单位是1像素。也可以使用CSS属性来设置<hr>标签的样式以使hr标签在外观上更加美观。

示例1:使用CSS height属性来设置<hr>标签的厚度

效果图:

示例2:使用CSS属性来设置<hr>标签的样式

效果图:

本文参考地址: https://www.html.cn/qa/css3/10312.html