Question

我有一些我正在使用的扭曲文字，由http://csswarp.eleqtriq.com/生成。它为warping创建了所有的CSS和HTML，我用<a>标签包装了它的类，它的类用于样式和jquery函数。

问题是，如果我将<a>中的跨度包裹起来，因为这些扭曲的单词是我的链接，所有样式（最重要的定位）都消失了...如果我从中删除包装器跨度，风格恢复正常，看起来翘曲等。

我在这里为我的问题编写了jsfiddle，http://jsfiddle.net/WJDwP/2/。

Answer 1

更改

#warped>span[class^=w]:nth-of-type(n+0)

到

#warped span[class^=w]:nth-of-type(n+0)

＆gt;组合器仅选择直接后代的元素。一旦你将<a>元素放在它们之间，它们就不再是直接的后代了。

所以我们应该使用好的旧后代选择器。

参考

Answer 2

如果我完全理解你的要求，那么这是一个非常简单的修复 - 你只需要将#willped＆gt; span [class ^ = w]选择器与一个包含了一个包含跨度的选择器叠加，例如：< / p>

#warped a>span[class^=w]:nth-of-type(n+0), #warped>span[class^=w]:nth-of-type(n+0){    
     display:block; position:absolute;
     -moz-transform-origin:50% 100%; 
     -webkit-transform-origin:50% 100%; -o-transform-origin:50%
     100%; -ms-transform-origin:50% 100%; transform-origin:50% 100%; }

以下是你的小提琴：http://jsfiddle.net/hanleybrand/5RHvk/

<span>在<a></a> </span>中包装时，<span>的CSS样式丢失了

2 个答案:

参考