:(有防盗链,请手动复制到新窗口打开)使用伪类:focus实现:https://ssl.huching.net/demo-...使用伪类:target实现:https://ssl.huching.net/demo-...(具体代码可直接查看demo源码)简单说明一下原理::focus的实现需要添加一个input元素。因为:focus只对输入有效。为每张图片添加一个输入层,然后调整样式使其不可见。当输入获得焦点时,添加放大图像的效果。使用:target实现需要添加多个锚链接。网上有很多这种用法的例子。:focus实现的缺点:增加一个input,然后伪装成普通元素,不够纯粹;因为是获取焦点,所以鼠标右键也会触发效果;自定义不同的光标样式(cursor)会有延迟;:target实现缺点:URL中有多个#id,影响美观,影响前进后退;不能直接选择#close,需要多次添加,不够简洁;无法直接点击图片恢复;我在网上总结了一些常见的伪类神奇效果(CSS标签栏切换效果、CSS手风琴效果等),有兴趣的可以看看:http://huching.net/2016/11/秒...
