首页 > 解决方案 > 如何在 HTML 元素上方创建间距,但仅在第一个元素之后?

问题描述

我正在使用带有 Twig 的 for 循环创建一些 HTML 元素的列表,这些元素显示在 Bootstrap 弹出窗口中。我想在每个元素之间留一个空格,但不是在第一个元素之前或最后一个元素之后。

我想要的是:

@Header Text
  info text
  text text text text text text
    <spacing here>
    <spacing here>
@ Header Text
  info text
  text text text text text text

从 for 循环开始的树枝代码创建每个信息元素

{% block content %}
{% for namesArrayIndex in 0..(section.getInstructorNamesArrayCount()-1)  %}
<div>

<span class="fa fa-user instructor-contact-info-header"></span>
    <div class="contact-info-container">
        <p class="instructor-contact-info-header"> . 
            {{section.getInstructorNamesArray()[namesArrayIndex]}}</p>
    {% set email = section.getInstructorEmails()[namesArrayIndex] %}
        <p class = "instructor-contact-info-data"> 
            <a  href="mailto: {{ email }}"> {{ email }} </a> </p>
    </div>
</div>

标签: htmlcsstwitter-bootstraptwig

解决方案


这对我来说听起来像是一个 CSS 问题。

.instructor:not(:first-child):not(:last-child) {
    margin: 10px 0px;
}

推荐阅读