为什么我无法缩放超链接

【问题标题】：Why I can't scale hyper link为什么我无法缩放超链接
【发布时间】：2015-03-11 20:45:18
【问题描述】：

我想缩放超链接，但我不能。

这是我尝试过的。

HTML

<div class="bgdf">
    <p>
        <small>Copyright <span class="glyphicon glyphicon-copyright-mark"></span>  All Right Reserved &nbsp &nbsp| &nbsp &nbsp <a href="www.google.com"> Testing </a></small>
    </p>
</div>

我试过了

.bgdf a:hover{
    transform: scale(1.3);
}

.bgdf a:hover {
  transform: scale(1.3);
}

<div class="bgdf">
  <p>
    <small>Copyright <span class="glyphicon glyphicon-copyright-mark"></span>  All Right Reserved &nbsp &nbsp| &nbsp &nbsp <a href="www.google.com"> Testing </a></small>
  </p>
</div>

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

这是因为a 元素默认是内联的。

CSS Transforms Module Level 1 - Terminology - Transformable Element

可变形元素是属于以下类别之一的元素：

一个元素，其布局由 CSS 框模型控制，该模型是 block-level 或 atomic inline-level element，或者其 display property 计算为 table-row、table-row-group、table-header-group、table -footer-group、table-cell 或 table-caption

SVG 命名空间中的一个元素，不受具有属性 transform、“patternTransform”或 gradientTransform 的 CSS 框模型的约束。

Transformations don't apply to strictly inline elements。您可以将锚元素的display 更改为inline-block，它应该可以按预期工作。

Example Here

.bgdf a {
    display: inline-block;
}
.bgdf a:hover {
    transform: scale(2);
}

【讨论】：