所以很多人都说“你不能”。是的，你可以。的确，css没有规则来控制破折号之间的排水沟空间，但css还有其他功能。不要急于说一件事做不到。

.hr {
    border-top: 5px dashed #CFCBCC;
    margin: 30px 0;
    position: relative;
}

.hr:before {
    background-color: #FFFFFF;
    content: "";
    height: 10px;
    position: absolute;
    top: -2px;
    width: 100%;
}

.hr:after {
    background-color: #FFFFFF;
    content: "";
    height: 10px;
    position: absolute;
    top: -13px;
    width: 100%;
}

基本上，border-top高度(在本例中为5px)是决定沟槽“宽度”的规则。当然，你需要调整颜色来匹配你的需要。这也是一个水平线的小例子，用左和右来做垂直线。

这是一个古老但仍然非常相关的话题。目前最上面的答案很好，但只适用于非常小的点。正如Bhojendra Rauniyar已经在评论中指出的，对于较大的点(>2px)，点看起来是方形的，而不是圆形的。我发现这个页面搜索的是间隔点，而不是间隔方块(甚至破折号，就像这里的一些答案使用的那样)。

在此基础上，我使用了径向梯度。同样，使用Ukuser32的答案，可以很容易地为所有四个边框重复点属性。只有角落不完美。

div { padding: 1em; background-image: radial-gradient(circle at 2.5px, #000 1.25px, rgba(255,255,255,0) 2.5px), radial-gradient(circle, #000 1.25px, rgba(255,255,255,0) 2.5px), radial-gradient(circle at 2.5px, #000 1.25px, rgba(255,255,255,0) 2.5px), radial-gradient(circle, #000 1.25px, rgba(255,255,255,0) 2.5px); background-position: top, right, bottom, left; background-size: 15px 5px, 5px 15px; background-repeat: repeat-x, repeat-y; } <div>Some content with round, spaced dots as border</div>

径向梯度期望:

形状和可选位置 两个或更多的停止:一个颜色和半径

在这里，我想要一个直径为5像素(半径为2.5px)的点，点之间的直径为2倍(10px)，加起来为15px。背景尺寸应该与这些相匹配。

这两个站点的定义是这样的点是漂亮的和光滑的:纯黑色的一半半径和比梯度到整个半径。

如果你只针对现代浏览器，并且你可以在一个独立的元素上设置边框，那么你可以使用CSS缩放变换来获得一个更大的点或破折号:

border: 1px dashed black;
border-radius: 10px;
-webkit-transform: scale(8);
transform: scale(8);

它需要大量的位置调整才能让它对齐，但它是有效的。通过改变边框的厚度，起始大小和比例因子，你可以得到你想要的厚度-长度比。你唯一不能碰的就是缺口比。

所以很多人都说“你不能”。是的，你可以。的确，css没有规则来控制破折号之间的排水沟空间，但css还有其他功能。不要急于说一件事做不到。

.hr {
    border-top: 5px dashed #CFCBCC;
    margin: 30px 0;
    position: relative;
}

.hr:before {
    background-color: #FFFFFF;
    content: "";
    height: 10px;
    position: absolute;
    top: -2px;
    width: 100%;
}

.hr:after {
    background-color: #FFFFFF;
    content: "";
    height: 10px;
    position: absolute;
    top: -13px;
    width: 100%;
}

基本上，border-top高度(在本例中为5px)是决定沟槽“宽度”的规则。当然，你需要调整颜色来匹配你的需要。这也是一个水平线的小例子，用左和右来做垂直线。

虽然迟到了，但我在网上找到了这个小巧玲珑的工具。

https://kovart.github.io/dashed-border-generator/

你不能用纯CSS做到这一点——CSS3规范甚至对此有一个特定的引用:

注意:不能控制点和破折号的间距，也不能控制破折号的长度。实现被鼓励选择一个使角对称的间距。

但是，您可以使用边框图像或背景图像来实现此目的。