Question

是否可以使用:after CSS伪元素来偏移对齐，而无需在content: ""中实际插入任何内容。除非指定内容，否则它似乎无法呈现，因此只是想知道这是否可行或是否有任何已知的解决方法。

举个例子： -

.nav-primary li.level0 a:after {
    content: "";
    padding-right: 1px;
    margin-left: -1px;
}

从示例中可以看出，仅仅更改内容的颜色在此实例中不起作用，因为仍然会占用影响偏移的空间。

Answer 1

可以使用:after伪元素，并将content property设置为空字符串""，但不能将其全部设置（以使其具有初始值{ {1}}，这意味着根本不会生成伪元素。

您没有看到任何效果的原因是您的设置有效地相互抵消了。您设置了一个负左边距，向左移动元素，但您设置了相同数量的填充。伪元素本身是空的，因此是不可见的，所以最重要的是它占据的空间。

这可以通过绘制轮廓来说明。为清晰起见，我使用值10px而不是1px：

none

.nav-primary li.level0 a:after {
    content: "";
    padding-right: 10px;
    margin-left: -10px;
    outline: solid red;
}

Answer 2

我遇到了类似的情况，方法是在display: block样式中添加:before。

Answer 3

据我所知可能使用带有空白内容的CSS伪元素。需要指定属性内容，但可以留空（就像在示例代码中所做的那样）。

我认为你的问题可能与显示模式有关 - 默认情况下，假元素是inline。如果我很清楚你想要实现的目标，我会这样做：

请参阅JSFiddle。