Add display property only from second item in for loop - php

Question

I am creating a simple image gallery that requires the first image to be shown first, while the images after are supposed to have a display;none property. How do I achieve it so that only the first image is different? The following is my code so far.
<div class="content">
<?php
foreach($variants['productVariants'][0]['productVariantImages'] as $variantImage){
if(isset($variantImage) && $variantImage['visible']){
?>
<img src="<?php echo $variantImage['imagePath']; ?>" class="image_<?php echo $variantImage['id']; ?>" style="display:none" alt="" />
<?php }}?>
</div>
My current output is
<div class="content">
<img src="images/bigs/2.jpg" class="image_1" style="display:none" alt="">
<img src="images/bigs/2.jpg" class="image_2" style="display:none" alt="">
<img src="images/bigs/3.jpg" class="image_3" style="display:none" alt="">
</div>
I would like to be able to achieve the following
<div class="content">
<img src="images/bigs/1.jpg" class="image_1" alt="">
<img src="images/bigs/2.jpg" class="image_2" style="display:none" alt="">
<img src="images/bigs/3.jpg" class="image_3" style="display:none" alt="">
</div>

Answer 1

You have multiple ways:
Using a variable (eg. $first, set it to true before the loop and to false at the end of the first iteration)
Using the keys of your (probably 0-indexed?) array (eg. foreach($variants['productVariants'][0]['productVariantImages'] as $key => $variantImage){, notice the $key => part). You can then check if $key is 0 in the loop and that's your first element.
As #alirezasafian suggested, simply use CSS - this is probably the most versatile method.

Answer 2

You don't need to use php for that, you can do it by css.
.content img:not(:first-child)
{
display: none;
}
.content img:not(:first-child) {
display: none;
}
<div class="content">
<img src="images/bigs/1.jpg" class="image_1" alt="1">
<img src="images/bigs/2.jpg" class="image_2" alt="2">
<img src="images/bigs/3.jpg" class="image_3" alt="3">
</div>