如何隐藏边框下方的背景 [英] How to hide the background underneath the border
问题描述
我需要修改一个网站,以使移动设备的所有链接的可点击区域更大.我为所有链接设置了透明的border
和大小相同的负数margin
,以不影响文本流.现在,这就像一个魅力.但不适用于具有背景的元素.背景散布到透明边框.这是在所有浏览器之间保持一致的行为接缝.
I need to modify a website to make the clickable zone of all links bigger for mobile devices. I gave all links a transparent border
and a negative margin
of the same size, to not affect the text-flow. Now this works like a charm. But not on elements that have a background. The background spreads out to the transparent border. This is behaviour seams to be consistent among all browsers.
http://jsfiddle.net/hq65C/1/这里是另一个示例: http://jsfiddle.net/DytDA/
http://jsfiddle.net/hq65C/1/ here a other example: http://jsfiddle.net/DytDA/
这是为什么?我一直以为边界在元素之外.我该如何解决. (我需要一个不需要修改HTML的解决方案).
Why is this? I was always thinking that the border is outside of the element. How could I fix this. (I need a solution that does not require to modify the HTML).
推荐答案
background-clip: padding-box;
怎么样?
Demo
这篇关于如何隐藏边框下方的背景的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!