html - 如何为我的 hr 标签获取渐变边框

标签 html css

我想要恰好 50% 的红色并保留任何其他颜色。我是网页设计新手,请帮助我。

hr{
    background: red; 
    background: -webkit-linear-gradient(red, yellow); 
    background: -o-linear-gradient(red, yellow); 
    background: -moz-linear-gradient(red, yellow);
    background: linear-gradient(red, yellow); 
}
<hr style="width:100%; height:5px;">

最佳答案

这些是你问题的答案

hr{ background: red; /* For browsers that do not support gradients */ 
  background: -webkit-linear-gradient(left, red , yellow); /*For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(right, red, yellow); /* For Opera 11.1 to 12.0 */ 
  background: -moz-linear-gradient(right, red, yellow); /* For Firefox 3.6 to 15 */ 
 background: linear-gradient(to right, red , yellow); /* Standard syntax */ }
.hr2{
    height: 25px;
    background: red; 
    background: -webkit-linear-gradient(red 50%, yellow 50%); 
    background: -o-linear-gradient(red 50%, yellow 50%); 
    background: -moz-linear-gradient(red 50%, yellow 50%);
    background: linear-gradient(red 50%, yellow 50%); 
}
<hr style="height:10px;">
<hr style="height:10px;" class="hr2">

关于html - 如何为我的 hr 标签获取渐变边框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39599263/

相关文章:

javascript - 使用 JQuery 和 Javascript 添加到 HTML 列表

html - 为什么我的 margin 不是 :10px auto; working?

html - 使用 CSS 创建交互式(?)导航?

jquery - 如何在单页中使用 jquery 滚动到保持 anchor 事件属性

javascript - 使用短\长文本垂直对齐按钮中的文本

html - CSS - 图像标题对齐不起作用

javascript - 如何模拟文本区域中的后退标签

JavaScript Youtube Search API v3 : Clear Results, 和验证函数

php - 当我尝试使用 <?php echo $id ?> 时,netbeans php 中属性 id "no whitespace"的错误值?

css - 链接文本伸出 div