css图片切换效果代码[不用js]

非常不错的图片切换效果代码，不用css，代码比较精简，推荐使用，注意一下多浏览器的兼容性

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>     <head>         <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><title>纯css图切换 练习 教程来自snwebsite</title><style type="text/css">             a{                 display:block;                 border:1px solid #cccccc;                 width:20px;                 height:20px;                 margin:1px;             }             dl{                 position:absolute;                 width:240px;                 height:170px;             }             dt{                 position:absolute;                 right:1px;                 top:25px;             }             dd{                 width:240px;                 height:170px;                 overflow:hidden;             }         </style></head><body>         <dl>             <dt><a href="#a">1</a><a href="#b">2</a><a href="#c">3</a></dt><dd>                 <img src="https://ss.0133.cn/article/a3/96/a4/a396a41a545fdeb65de831d077dbc3e2.jpg-600" id="a"/><img src="https://ss.0133.cn/article/bd/03/65/bd03654ec7a8798a140675f7423d61de.jpg-600" id="b"/><img src="https://ss.0133.cn/article/9a/1f/f1/9a1ff17c3feefba0bf1453c4e437f206.jpg-600" id="c"/></dd></dl></body></html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

以上就是css图片切换效果代码[不用js]的详细内容，更多请关注0133技术站其它相关文章！

css图片切换效果代码[不用js]

相关文章

前端开发

置顶推荐

猜你喜欢