我需要在我的网站上放置一个画廊，该画廊仅显示每个类别的第一张图片。 我还使用FlexGrid，因为我的布局有三列。
我有一个foreach循环，该循环为每个图像创建一个<a>标签，以便可以访问打开图库的所有图片。
然后，我要做的是隐藏所有<a>的图像编号。 2、3、4等
现在的问题是，即使我将<a>设置为display: none，但LostGrid似乎仍然记得我拥有所有这些.gallery
display block
margin-top 50px
a
display block
lost-column 1/3 3 30px
position relative
padding-bottom 17.25%
margin-bottom 30px
> div
position absolute
top 0
right 0
bottom 0
left 0
background-size cover
background-position center
&.hidden
display none标签，并且布局变得很疯狂。
我一直在考虑，但是我真的不知道该怎么解决。
有人可以帮助我吗？ 谢谢！
What I'd like (right solution)
这是我的代码（HTML / PHP [Kirby] + CSS [Stylus]）的基本部分： 当然，如果您运行它就行不通。
<div class="gallery">
<?php foreach($categories as $category): ?>
<?php foreach($category->object()->toStructure() as $object): ?>
<?php if($object->gallery()->isnotEmpty()): ?>
<?php $i = 0 ?>
<?php foreach($object->gallery()->toFiles() as $image): ?>
<a <?php e(!$i != 1,'class="hidden"') ?> href="<?php echo $image->url() ?>" data-fancybox="gallery" data-caption="<?php echo $image->caption()->html() ?>">
<div class="image" style="background-image: url('<?php echo $image->url() ?>')"></div>
</a>
<?php $i++ ?>
<?php endforeach ?>
<?php endif ?>
<?php endforeach ?>
<?php endforeach ?>
</div>ServerClass.start()