时间戳

首页 > 解决方案 > 删除行之间的边距

html - 删除行之间的边距

问题描述

我想删除 hello 和 dd 之间的边距，我该怎么做。

<div className="container border border-primary">
        <div className="row">
          <div className="">A </div>
            <div className="col">
                <div className="row justify-content-between m-0 p-0">
                    <p>hello</p>
                    <p>hello</p>
                </div>
                <div className='row m-0 p-0'>
                    dd
                </div>
            </div>
        </div>
    </div>

在此处输入图像描述

标签： htmlcsstwitter-bootstrap

解决方案

您必须删除<p>元素的边距以删除行之间的空间。

您有三种可能性来解决这个问题：

  • .m-0在<p>元素本身上使用 Bootstrap 实用程序类。
  • 用于删除元素margin的自定义 CSS 规则。<p>
  • 使用<span>元素而不是<p>元素。

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

<div class="container border border-primary">
  <div class="row">
    <div>A</div>
    <div class="col">
      <div class="row justify-content-between m-0 p-0">
        <p class="m-0">hello</p>
        <p class="m-0">hello</p>
      </div>
      <div class='row m-0 p-0'>dd</div>
    </div>
  </div>
</div>

推荐阅读