如何只用css实现灯箱效果？可用示例
http://www.w3css.co.uk/
该网站说它不使用：target，我查看了源代码，据我所知，没有 js，所以它只是 css 那么？如何 。一个小小提琴例子或解释将非常感激。谢谢。
http://www.w3css.co.uk/
The website says it doesn't use :target, I looked at the source there is no js as far as i can see so its all just css then ? How . A small fiddle example or an explanation would be very much appreciated.Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
:active用于 IE 的伪类，:focus用于非 IE，如 CSS。:activepseudo class for IE,:focusfor non-IE as commented in the CSS.阅读有关 css3 过渡的信息（此链接有很好的解释），它提供了一种对 CSS 属性进行动画更改的方法，而不是让更改立即生效，该网站演示了使用它可以实现的一些效果
Read about css3 transitions (this link has good explanation) ,it provides a way to animate changes to CSS properties, instead of having the changes take effect instantly, This site demonstrates few effects that can be achieved using it
触发打开灯箱的事件是焦点事件。这也是为什么您可以通过按 Tab 或 Shift-Tab 来切换图像。正如 Neil 所说，您可以在 css 文件中找到详细信息。
如果您只是加载网站并经常按选项卡按钮来聚焦其中一张图片，灯箱也会打开。
The event that is firing to open the lightbox is the focus event. That is also why you can switch through the images by pressing tab or shift-tab. As Neil stated, you can find the details in the css file.
If you just load the site and press the tab button often enough to focus one of the pictures, the lightbox will also open.
缩略图上使用的 CSS 选择器是
:focus和:active选择器，它们在您单击锚点时应用（为 IE 兼容性而激活，以及什么）你会在 Firebug 中看到）。这些选择器仅具有将压缩的图像扩展为完整尺寸的 CSS 过渡，那么当您单击另一个元素并且灯箱消失时，显然
:focus会丢失。您还可以使用 Tab 键进行导航，这样您只需在锚点之间切换焦点，从而再次激活 CSS 过渡。The CSS selector that is being using on the thumbnails is the
:focusand:activeselectors, which are applied when you click on an anchor (active for IE compatibility, and what you'll see in Firebug).These selectors simply have the CSS transitions that expand the squashed image to full size, then obviously the
:focusis lost when you click on another element and the lightbox disappears. You can also navigate using the tab keys as in doing so you are just switching the focus between the anchors and thus activating the CSS transitions again.