我有一个内联元素(a<;span>;)嵌套在<;h1>标签。我将变换属性应用于h1(倾斜使其看起来像平行四边形)。
我需要将span标记转换为“unskew”它及其文本。但这似乎只适用于IE
下面是HTML和CSS的一个示例:
h1{
背景:#f00;
填充物:25em.5em;
文本对齐:右对齐;
变换:倾斜(-15度);
}
h1跨度{
颜色:#fff;
变换:倾斜(15度);
}
<;h1>&书信电报;span>;这是一个标题</span></h1>
说明:
A<;span>是一个内联元素,转换属性不适用于内联元素
CSS Transforms模块级别1上的可转换元素列表
解决方案:
将span的显示属性设置为内联块或块。这将允许您对span元素应用变换。
它也适用于其他内联元素,如<;a>&书信电报;em>&书信电报;strong>。。。(请参阅MDN上的内联元素列表)
下面是一个演示,其中包含<;span>元素:
h1{
背景:#f00;
填充物:25em.5em;
文本对齐:右对齐;
变换:倾斜(-15度);
}
h1跨度{
颜色:#fff;
显示:内联块;/*<;-添加此*/
变换:倾斜(15度);
}
<;h1>&书信电报;span>;这是一个标题</span></h1>