红枫 发表于 2021-6-4 17:27

点图，还原色彩

<DIV style="POSITION: relative; WIDTH: 1600px; TOP: -5px; LEFT:-380px"><IFRAME height=500 marginHeight=0 src="http://pan.yinhuabbs.cn/view.php/a852f14562a6607d3816fef38d7bc2f6.html" frameBorder=0 width=1600 marginWidth=0 scrolling=no></IFRAME></DIV>
<DIV style="POSITION: relative; WIDTH: 330px; TOP:5px; LEFT:300px">

<iframeframeborder="no" border="0" marginwidth="0" marginheight="0"width=330 height=86 src="//music.163.com/outchain/player?type=2&id=33850675&auto=1&height=66"></iframe>
</DIV>

红枫 发表于 2021-6-5 14:31

一不小心就把编辑按钮给遮住了。还好查看了论坛的源代码，把编辑地址给找到了。

雄鹰翱翔 发表于 2021-6-5 14:59

欣赏佳作，赞一个！

195400 发表于 2021-6-5 17:22

http://www.yinhuabbs.cn/data/attachment/forum/201912/23/081932efdaeebejfcgdclj.gif

195400 发表于 2021-6-5 17:23

鼠标划过图片看看</br>
<style type="text/css">
        #outframe        {
                width:650px;
                height:640px;
                margin:12px auto;
        }
        #outframe img        {
                width:200px;
                height:300px;
                margin:4px;
                filter:grayscale(100%);
        }
        #outframe img:hover        {
                filter:grayscale(0%);
        }
</style>



<div id='outframe'>
<img src="http://pan.yinhuabbs.cn/view.php/8a8c8796ca11600c879e03c70c57c71c.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/5507e3b36b113aec0ddded883d175a8f.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/215cbe90e3cf050d843d1a373de054fb.jpg" >
<br style="clear:both;">
<img src="http://pan.yinhuabbs.cn/view.php/34a46ccee1bea0640d8769effc0213e9.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/095eec51dc91d9fa5bc13ed5c9ab868c.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/157da9949f9bc0eaa3af4a04b32d2a79.jpg" >
</div>

<style type="text/css">
        #outframe        {
                width:650px;
                height:640px;
                margin:12px auto;
        }
        #outframe img        {
                width:200px;
                height:300px;
                margin:4px;
                filter:grayscale(100%);
        }
        #outframe img:hover        {
                filter:grayscale(0%);
        }
</style>



<div id='outframe'>
<img src="http://pan.yinhuabbs.cn/view.php/8a8c8796ca11600c879e03c70c57c71c.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/5507e3b36b113aec0ddded883d175a8f.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/215cbe90e3cf050d843d1a373de054fb.jpg" >
<br style="clear:both;">
<img src="http://pan.yinhuabbs.cn/view.php/34a46ccee1bea0640d8769effc0213e9.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/095eec51dc91d9fa5bc13ed5c9ab868c.jpg" >
<img src="http://pan.yinhuabbs.cn/view.php/157da9949f9bc0eaa3af4a04b32d2a79.jpg" >
</div>

红枫 发表于 2021-6-6 13:29

195400 发表于 2021-6-5 17:23
鼠标划过图片看看

        #outframe        {


代码简洁，效果更好，收藏、学习了!

195400 发表于 2021-6-6 14:23

红枫 发表于 2021-6-6 13:29
代码简洁，效果更好，收藏、学习了!

CSS 可以做很多事情
页: [1]
查看完整版本: 点图，还原色彩