[英]Having trouble with <hr> in CSS
When I use this code it displays the circle dots like I want it to. 当我使用此代码时,它会像我希望的那样显示圆点。 But that only happens in chrome, when I view the website on safari it is square.
但这仅在Chrome中发生,当我在野生动物园中查看网站时,它是方形的。 Is there any way to make it so it displays the same on both safari and chrome?
有什么方法可以使其在Safari和Chrome上显示相同吗?
I tried it in chrome and it works perfectly, but on safari it is squares. 我在chrome中尝试过,效果很好,但在野生动物园中却是正方形。
hr { border-style: none; border-top-style: dotted; border-color:green; border-width: 10px; width:30%; }
<hr>
Try this: 尝试这个:
hr { border-top: 10px dotted green; width: 30%; height: 0.01px; border-top-style: dotted; border-left: none; border-right: none; border-bottom: none; color: green; display: block; border-color: green; }
<hr>
You can use Pseudo: after element to set dotted line after the text.Here is the example. 您可以使用Pseudo:after元素在文本后设置虚线。以下是示例。
div {
display: flex;
width: 300px;
}
div:after {
border-bottom: 1px dotted black;
content: '';
flex: 1;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.