Home >Web Front-end >CSS Tutorial >CSS code to implement hiding and showing functions

CSS code to implement hiding and showing functions

高洛峰
高洛峰Original
2017-03-08 13:43:562237browse

Without further ado, I will just post the code for you

The key code is as follows:

<head>   
 <meta http-equiv="content-type" content="text/html;charset=utf-8">   
 <style>   
 .trans-fadeout{   
-webkit-transition:all 1s linear;   
-moz-transition:all 1s linear;   
-ms-transition:all 1s linear;   
-o-transition:all 1s linear;   
 transition:all 1s linear;   
}   
.image-fadeout{ position:absolute;opacity:0 }   
.hover-fadeout:hover .image-fadeout{ opacity:1 }   
</style>   
 </head>   
<body>   
<p class="hover-fadeout">   
<img src="http://image.zhangxinxu.com/image/study/s/s256/mm1.jpg" class="trans-fadeout image-fadeout" />   
<a href="#" _fcksavedurl=""#"" >经过我显示图片</a>   
</p>

The above is given by the editor I introduced the CSS code to implement the hiding and display functions. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank you all for your support of the PHP Chinese website!

The above is the detailed content of CSS code to implement hiding and showing functions. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn