css – 如何在div中创建一个链接填充div内的整个空间?

前端之家收集整理的这篇文章主要介绍了css – 如何在div中创建一个链接填充div内的整个空间?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个设置宽度的div,它包裹在一个链接。我希望里面的链接填充div的整个空间,这样当我点击div中的任何地方(我的样式看起来像一个按钮)时,它会转到链接。这是我尝试过的,但是.link_class没有做我想要的。有什么建议么?

HTML:

<div class="button_class">
    <a class="link_class" href="http://www.my_link.com>My Link</a>
</div>

CSS:

.button_class {
    width:150px;
    padding:5px 7px;
    color:#fff;
    text-align:center;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
}

.link_class {
    width:100%;
    height:100%;
}

解决方法

这应该做的伎俩: –

默认情况下,a是内联元素,宽度不会影响它们。因此,将其更改为内联块以使其获取您指定的宽度。

.link_class {
    display:inline-block;
    width:100%;
    height:100%;
}

Fiddle

原文链接:https://www.f2er.com/css/217935.html

猜你在找的CSS相关文章