小编Nat*_*yan的帖子

当我text-align:center为宽度大于文本宽度的元素指定时,文本在元素的内容框中居中(如预期的那样).

当我text-align:center为宽度小于文本宽度的元素指定时,文本将与内容框的左边缘对齐,并溢出内容框的右边缘.

您可以在此处查看这两个案例.

任何CSS魔法都可以使文本同样溢出内容框的左边缘和右边缘,以便它保持居中吗？

仅使用CSS,可以通过操纵单个矩形来创建内角大于180度的四边形吗？我知道可以使用CSS3转换从标准矩形创建任意凸四边形.

我已经能够以几种不同的方式使用多个矩形创建凹多边形(有时借助隐藏溢出); 一些组合:

1. 相邻的矩形.这是一个问题,因为由于抗锯齿而在接缝处出现视觉差异,这在高对比度背景下更明显.当与旋转一起使用时效果可能特别差(除了像45度这样的"漂亮"旋转).矩形还具有令人发狂的倾向,即在各种变焦水平下奇怪地对齐.
2. 重叠矩形,其中四边形由矩形的并集组成(每个矩形的颜色是四边形的颜色).当四边形的颜色使用alpha通道时,这是一个问题,因为重叠区域看起来更暗.
3. 重叠矩形,其中四边形由矩形的差异组成(至少一个矩形的颜色是背景的颜色).当通过在偏移处绘制相同形状来模拟阴影时,这是一个问题,因为前景的重叠区域"擦除"任何底层阴影.

[编辑] 这里可以看到使用#1和#3的凹四边形(一种"星际迷航"符号)的例子.

我希望有一个带有模拟插入阴影的凹四边形(带有alpha通道的深色前景色,带有alpha通道的浅色阴影),这就是上面的#2和#3有问题的原因.在这一点上,一个实际的阴影似乎是不可能的; 我对调整元素的阴影没有很好的体验.

那么,有没有可能通过操纵一个矩形来做到这一点？或者,还有其他一些我没有考虑过的方法吗？

[编辑]

我认为这是可能在有限的程度,但它是一种作弊的:使用单字符的文本,其字形已经在一些合理的安全字体凹四边形(例如,U + 27A4,黑色宋体的Unicode向右箭头) ,然后改变废话.但是,这会导致跨浏览器与页面的其他元素对齐的问题.