文本超链接褪色成图像也超链接

问题描述：

在文本超链接的时刻，当它消失到其它图像的链接不再存在，你可以有第二图像（它退色入链接的一个）文本超链接褪色成图像也超链接

它似乎只有超文本链接，然后当图像出现链接消失。

这里是我的代码感谢

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Page Title</title> 
    </head> 
    <body> 
<style> 
    div{ 
     background-image: url("http://#.com"); 
     height: 200px; 
     width:200px; 
     transition: background-image 0.7s ease-in-out; 
       transition: 0.6s ease-in-out; 
    } 
    #hello:hover{ 
     font-size:0px; 
     background-image: url('http://#.com'); 

    } 

    #hmv:hover{ 

     font-size:0px; 
     background-image: url("http://#.com"); 

    } 

    p{ text-align:center;font-size:3em;} 
</style> 

<div id="hello"> 

    <br> 

<a href="#"><p>Pottery</p></a> 
</div> 
<br> 
<div id="hmv"> 

    <br> 

<a href="#"><p>Silver</p></a> 
</div> 
    </body> 
</html>

可不可以给任何演示网址。然后澄清更好。 – Bipon

什么是你想达到什么目的？能否请你澄清 –

有什么问题吗？ https://codepen.io/anon/pen/OgGXvr – Nivedita

答

您更改字体大小为0px悬停，这就是为什么文本消失，我注释掉了字体大小线，检查出来。

#hello:hover{ 
    /* font-size:0px; */ 
    background-image: url('http://#.com'); 

} 

#hmv:hover{ 

    /* font-size:0px; */ 
    background-image: url("http://#.com"); 

}

这一工程是有可能有文字移动到图片的底部，显示图像更？ –

是的，你可以给p标签填充，就像这样， ' #hello：hover p， #hmv：hover p { padding-top：50％; }' –

这非常适用的感谢！ –

文本超链接褪色成图像也超链接

相关推荐