Question

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

这是我尝试过的。

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);
}

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 1

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

CSS Transforms Module Level 1 - Terminology - Transformable Element

可转换元素是以下类别之一的元素：


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

SVG命名空间中的一个元素，不受CSS框模型的控制，该模型具有属性transform，'patternTransform'或gradientTransform。

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

Example Here

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

为什么我无法扩展超链接

1 个答案: