HTML CSS <a>相同DIV元素</a>之间的垂直间距

Question

此刻，我在第一张照片中看到了什么。 我想知道如何在图像之间添加空格（底部边距？），如图2所示？ 它们的2个并排的块是2个不同的DIV，并且每行中的图片都是同一div的元素，因此底边距不起作用。 （底部代码）

图片1：

图片2

HTML：

...
<div class="meniu">
                    <a href="#">NAUJIENOS</a>
                    <a href="#">KREPSINIO VADOVAS</a>
                    <a href="#">TRENIRUOTES</a>
                    <a href="#">IDOMYBES</a>
                    <a href="#">GALERIJA</a>
                    <a href="#">APIE MUS</a>
                </div>
                <div class="rightbar">
                    <div class="rightpic2"> 
                        <a href="#"><img src="pic3.png"></a> <br>
                        <a href="#"><img src="pic4.png"></a> <br>
                        <a href="#"><img src="pic4.png"></a> <br>
                        <a href="#"><img src="pic5.png"></a> <br>
                        <a href="#"><img src="pic3.png"></a> 
                    </div>
                </div>

                <div class="rightpic1"> 
                    <a href="#"><img src="pic1.jpg"></a> <br>
                    <a href="#"><img src="pic2.jpg"></a>

                </div>
...

CSS：

.rightpic1{
        float:right;
        margin-right:30px;
        margin-top:100px;


    }

    .rightpic2{

        margin-right:24px;
        margin-left:24px;
        margin-top:38px;
    }

    .rightbar{

        float:right;
        background-color:white;
        margin-top:62px;
    }

Answer 1

<a>元素内联显示。 将所有<br>标记掉，然后将display: block添加到CSS。

.rightpic1 a, .rightpic2 a {
    display: block;
    margin-top: 15px
}

Answer 2

首先，您需要关闭所有图像标签。 然后添加display:block; 到.rightpick1和.rightpick2类内的链接。 然后，您可以成功在链接中添加一个margin-bottom 。

我以小提琴为例。 希望有帮助！