Question

我目前正在尝试在不使用JS的情况下在我的主页上实施照片库。

我在网上有以下代码，但我不明白中间线正是在做什么。

.image-gallery .big-image a:target img {display:block;}
.image-gallery .big-image a:target ~ img#default {display:none; width:1px;}
.image-gallery .big-image img#default {display:block;}

波形符应该连接父（a：target）和#default图像。我知道应该做什么目标，但是target应该做的a是什么？为什么我需要它？

Answer 1

由于您没有提供标记，因此很难提供具体答案。但是，以下文章应提供必要的信息来计算〜和：目标选择器。

http://css-tricks.com/almanac/selectors/t/target/

http://css-tricks.com/almanac/selectors/g/general-sibling/

我提供的最好的教育猜测是：目标被用于直接深入链接到图库中的图像。例如，如果用户要转到图库中的图像3，则URL可能会更改为/ gallery＃3。如果他们共享该网址，则图库会自动转到图库中的第三张图片。＆＃34; ~img #default＆＃34;如果用户深层链接到图像，则可能会隐藏默认的起始图像。同样，这只是猜测，因为没有提供标记。

没有Javascript的照相馆

1 个答案: