我想在字WEBLOG镜像字母E,所以我使用CSS transform属性,但它不工作,如果我包装一个跨度内的文本,但它的工作,如果我assing display:inline-block;或display:block;
所以变换不适用于内联元素?
Example 1(无法转换)
<h1>W<span>E</span>BLOG</h1> h1 span { transform:rotate(7deg); -ms-transform:rotate(7deg); /* IE 9 */ -moz-transform:rotate(7deg); /* Firefox */ -webkit-transform:rotate(7deg); /* Safari and Chrome */ -o-transform:rotate(7deg); /* Opera */ }
解决方法
在这里
the official W3 specifications下
transformable element:
an element whose layout is governed by the CSS Box model which is
either a block-level or atomic inline-level element,or whose ‘display’ property computes to ‘table-row’,‘table-row-group’,‘table-header-group’,‘table-footer-group’,‘table-cell’,or ‘table-caption’ [CSS21]