增加html链接的半径

Question

如何在不增加内容大小或更改内容大小的情况下增加链接半径？

我有一些附加小图片的链接，它工作正常，但很难完全点击图像（特别是在移动设备上）。我试图修改链接，这样即使你点击它附近（比如说+-10px），它仍会是你想要的网址。

我的Html：

<i class="icon-plus-sign" onclick="javascript:ClickMe();" style="cursor: pointer;"></i>

我的猜测是，我应该创建一个css类并将其应用于链接，但我不知道如何制作CSS

padding:10px会通过增加链接的父级大小来更改页面设计。

Answer 1

如果要展开可点击区域，可以使用padding:10px。但是，如果您希望边界大小不变，请尝试应用margin:-10px：

i {
  cursor:pointer;
  padding:10px;
  margin:-10px;
}

Demo.

在演示中，您可以看到父div的边框靠近内部i子项，就好像i的大小没有变化一样。但是，将鼠标悬停在i元素周围的区域仍然会影响光标以更改为pointer，这时您可以单击图标。

Answer 2

你可以通过给她

来增加它的大小

padding:10px;

Answer 3

这样的事可能会这样做：

http://jsfiddle.net/3K6Qq/

只需使用

即可

style="padding:10px;"

并更改像素数以更改链接的大小，并且您不需要单独的css文件。

Answer 4

您可以在图像下添加div，并将其设置为您想要的任何大小。

我用过它并且效果很好

<a href="#">
    <img src="#">
        <div id="expand">
        </div>
 </a>

我更喜欢填充的想法。