如何改变hr标签的颜色

最新推荐文章于 2022-08-12 14:59:44 发布
最新推荐文章于 2022-08-12 14:59:44 发布
阅读量6.1k 收藏 11
点赞数 7
分类专栏： css 文章标签： css
原文链接：https://blog.csdn.net/wy6250000/article/details/83755114
版权 
<hr style='background-color:blue; height:1px; border:none;''/>

hr标签是线条，其颜色要用background-color；

再给线条设置一个height，正常粗细就是1px，设置完后线条变粗；

那是因为hr有默认的border，需要将它的边框去掉，设为border:none

以上三点缺一不可

荔枝1
关注
  • 7
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
自定义设置hr的颜色
NINE-NINE的博客
05-14 5830
自定义设置hr的颜色
如何改变hr颜色
热门推荐
06-08 1万+
html中用css改变颜色，如果不加border:0;的话，虽然颜色改变了，但是会显示一条黑色的边框。如果不加height:1px;的话，在firefox下会不显示。还可以用下面的代码：
修改hr标签的颜色
Smile_Monica的博客
06-28 5972
之前的时候遇到线条的颜色都是直接使用div，然后使用padding属性让它和它里面的内容区分出来。今天在写的时候突然觉得如果每次都是这样的话，hr标签就会浪费掉了。于是在网上搜了一下，发现可以进行如下设置：1）不要再使用color这个属性了，而是使用background-color属性。2）因为hr标签是块级标签，所以它是有边框的，我们需要设置它自身的边框为0。3）然后定义自己的hr的高度和颜色。...
更改hr元素的颜色
p15097962069的博客
12-31 1689
我想使用CSS更改hr标签的颜色。 我在下面尝试过的代码似乎不起作用： hr { color: #123455; }
如何改变hr水平线的颜色
孙婷婷的博客
02-18 3911
改变hr水平线的颜色： 1. hr的高度(height)不能是0； 2. border设为none; 3. 使用background-color: 来控制水平线的颜色； 示例代码： 将水平线设为红色： hr { border: none; height；1px; background-color: red; } ...
【实战】前端必会 —— css更改hr标签颜色
程序边界
08-12 767
css更改hr标签颜色。
css控制水平衡线hr标签样式去掉其阴影效果
09-25
为了去掉这种阴影效果，我们可以利用CSS来调整`<hr>`标签的样式。主要涉及到的CSS属性有`border-top`和`border-bottom`。这两个属性分别定义了元素顶部和底部的边框。在默认情况下，`<hr>`的`border-top`和`border-...
css控制水平衡线hr标签样式去掉阴影效果
09-25
在网页设计中，`<hr>`（Horizontal Rule）标签常被用来表示文本段落之间的分隔线，呈现出一种水平平衡线的效果。默认情况下，`<hr>`标签的样式可能会带有阴影效果，这是因为浏览器的默认样式设定使然。为了获得更...
css中hr标签的各种用法
12-09
然而，通过CSS，我们可以进一步定制`<hr>`标签的外观，使其在设计中发挥更多作用。本文将详细介绍`<hr>`标签的各种CSS用法。 1. **基本使用** `<hr>`标签默认会生成一条横跨页面的单线条。例如： ```html <hr> ...
关于hr标记在各浏览器中的问题说明
12-14
一般我们很少见HR，但一见可能就定生死。HTML中也一样，我们不常见<hr>，但一见通常...2px时，显示高度为灰色投影，需要color来设置颜色，相同于文字) background-color 比如想创建一个实际高度为3px, 四边为1px, 边
HTML标签汇总模板.doc
11-23
<hr> 标签用于在网页中插入水平线，可以设置线的粗细、宽度、颜色等属性。 * size：设置水平线的粗细 * width：设置水平线的宽度 * align：设置水平线的对齐方式 * color：设置水平线的颜色 * noshade：取消水平线...
html标签和属性总结
07-06
* `<hr>`：水平线标签 * `<sub>`：下标文本标签 * `<sup>`：上标文本标签 HTML标签和属性是构建Web页面的基础，了解这些标签和属性的使用方法是非常重要的。本文总结了HTML标签的种类、属性和使用方法，希望能够...
HTML标签和属性
07-08
* `<hr>`：插入一条水平线 * `<center>`：将字、画、表格等水平居中 * `<pre>`：定义欲格式化的文本，被包围在其中的文本通常会保留空格和换行符 字体标签 * `<strong></strong>`：将文本定义成语气更强的强调内容...
html中常用的标签总结(必看)
12-14
通常为斜体强调文本通常为斜体加重文本，通常为黑体设置字体、字体大小、颜色等<big><small>字体变大和字体变小加删除线程序码定义键盘文本块引用，通常是缩进地址标签上标下标 换行<hr>水平线 列表标签： 、和是...
html标签属性大全
03-20
- `<hr>`：创建水平线，可以通过`size`、`width`和`color`属性进行定制。 - ` `：进行单行换行。 - `<nobr>`：阻止文本换行，保持在同一行显示。 - `<p>`：定义段落。 4. **连结格式**： - `<base>`：为...
html中hr怎么修改颜色,关于html中hr的颜色设置
weixin_32558831的博客
06-03 1963
这个代码在我的短暂网页制作生涯中还没有用到过。不过下午girlfriend问及颜色设置问题。照着一般代码的属性猜了一下。说在就应该可以的。试着写了一个简单的页面。果然变为红色。又在百度上搜了一下。还有其他的可选属性，一并列下。HTML 标签一、定义与用法标签可以插入水平线二、在HTML和XHTML中的区别在HTML中标签不需要结束标签在XHTML中标签必须合理的关闭 实例：This is some...
html 怎么设置hr的颜色,html hr标签能设置黄颜色吗
weixin_29792607的博客
07-09 8904
在HTML中，hr标签可以设置黄颜色，只需要利用hr标签的style属性添加颜色样式即可，语法格式“”。border-color属性用于给元素设置边框颜色。本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。 标签定义 HTML 页面中的主题变化(比如话题的转移)，并显示为一条水平线。 元素被用来分隔 HTML 页面中的内容(或者定义一个变化)。默认...
html 改变hr 颜色,更改hr元素的颜色
weixin_36207483的博客
06-22 2159
我想如果您打算更改tag 产生的线条的颜色，则应该使用border-color而不是。color虽然，在注释中已经指出，如果您更改线条的大小，边框仍将与样式中指定的宽度一样，并且线条将被填充为默认颜色(大多数情况下这不是期望的效果)时间)。因此，在这种情况下，您似乎还需要指定background-color(如@Ibu在其答案中建议的那样)。HTML 5 Boilerplate项目的默认样式表中指...
hr标签颜色
最新发布
05-30
HR标签默认的颜色是灰色，但可以通过CSS来修改其颜色。例如，将HR标签的颜色改为红色，可以使用以下代码： ```css hr { border-color: red; } ``` 如果要将HR标签的宽度也改为100%并且加上一些样式，可以使用以下代码： ```css hr { border: none; border-top: 2px solid red; width: 100%; margin: 20px 0; } ``` 其中，`border: none`表示去除原本的边框，`border-top: 2px solid red`表示添加一条红色的上边框，`width: 100%`表示将HR标签的宽度设置为父容器的100%，`margin: 20px 0`表示在HR标签的上下各添加20像素的外边距。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值