Html 超链接图像在较小屏幕上不可单击
我有一个带有超链接的图像,当较小屏幕的css启动时,它变得不可链接。我不明白为什么 页面如下: 这是页面本身的HTML,有问题的图像/链接用**Html 超链接图像在较小屏幕上不可单击,html,css,image,hyperlink,Html,Css,Image,Hyperlink,我有一个带有超链接的图像,当较小屏幕的css启动时,它变得不可链接。我不明白为什么 页面如下: 这是页面本身的HTML,有问题的图像/链接用** <div class="reseller_container"> <div class="reseller_header">BECOME A RESELLER</div> <img src="https://cdn.shopify.com/s/files/1/1899/1203/files/jupa-resel
<div class="reseller_container">
<div class="reseller_header">BECOME A RESELLER</div>
<img src="https://cdn.shopify.com/s/files/1/1899/1203/files/jupa-reseller-background.png?12251079152443546141" />
<p>We're always on the lookout for <b>BUSINESSES OR INDIVIDUALS</b> who would like to <b>BUILD A RELATIONSHIP</b> with JUPA, whether that's <b>RESELLING</b> our charger or <b>ANYTHING ELSE</b>. If you feel this would be something for you then please <b>GET IN TOUCH</b> with us.</p>
**<a href="http://www.jupacharge.com/pages/contact"><img class="contact_button" src="https://cdn.shopify.com/s/files/1/1899/1203/files/jupa-get-in-touch.png?15833297944705309626" /></a>**
<div class="reseller_text">We will aim to respond to your enquiry within 1 business day</div>
</div>
<img class="deal_icon" src="https://cdn.shopify.com/s/files/1/1899/1203/files/jupa-deal.png?15833297944705309626" />
非常感谢您的帮助。对于低于600px的css,您需要将页眉高度设置为0。它在较低分辨率上与您的内容重叠。但在同一个地方,当它超过600px时,它在开发工具中是重叠的,但链接是可点击的 无论如何,这是代码:
@media (max-width:600px) {
...
.reseller_header {
position:absolute;
height: 0;
top: 4%;
left: 0;
bottom: 0;
right: 0;
color: #66BD00;
font-size: 12vmin;
font-family: ubuntu;
font-weight:bold;
text-align:center;
line-height: 1em;
}
...
}
这是因为以下规则。移除
底部:0
,您应该会没事的。这是一个溢出问题
@media (max-width: 600px) {
.reseller_header {
position: absolute;
top: 4%;
left: 0;
bottom: 0; /* remove this */
right: 0;
color: #66BD00;
font-size: 12vmin;
font-family: ubuntu;
font-weight: bold;
text-align: center;
line-height: 1em;
}
}
非常感谢。这是一个很容易解决的问题。我会投赞成票的,不会的,不会的,谢谢!虽然我使用了下面的方法,因为它少了2行CSS,但是我也尝试了这个方法,效果很好。
@media (max-width: 600px) {
.reseller_header {
position: absolute;
top: 4%;
left: 0;
bottom: 0; /* remove this */
right: 0;
color: #66BD00;
font-size: 12vmin;
font-family: ubuntu;
font-weight: bold;
text-align: center;
line-height: 1em;
}
}