Bootstrap 3 열에서 원하지 않는 패딩과 여백을 제거하는 방법은 무엇입니까?

Bootstrap 3의 열에서 패딩 제거

Bootstrap 3의 그리드 시스템을 사용할 때 열 주위에 추가 패딩이나 여백이 발생하는 것이 일반적입니다. 이를 제거하는 방법은 다음과 같습니다.

코드에서:

<div class="col-md-12">
    <h2 class="h2">OntoExplorer.<span>

두 개의 열(col-md-4 및 col-md-8)을 col-md- 안에 래핑했습니다. 12열. 기본적으로 col-md-12는 여백과 안쪽 여백을 포함하여 전체 행을 차지하므로 불필요한 추가 공간이 발생합니다.

이 문제를 해결하려면 .col-md-12 대신 .row를 사용하세요. 상위 컨테이너. 이렇게 하면 불필요한 패딩이나 여백 없이 두 열이 나란히 렌더링됩니다.

<div class="container">
    <div class="row">
        <h2 class="h2">OntoExplorer.<span>

여전히 개별 열에서 패딩이나 여백을 제거하려면 사용자 정의 CSS를 추가할 수 있습니다. 다음과 같은 클래스를 사용하세요.

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

그런 다음 패딩이나 여백을 제거하려는 열에 이 클래스를 적용하세요.

<div class="col-md-4 nopadding">

위 내용은 Bootstrap 3 열에서 원하지 않는 패딩과 여백을 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!