홈>
부트 스트랩을 사용하는 행이 있고 첫 번째 자식과 마지막 자식을 제외한 각 섹션 사이에 공백을 추가하고 싶습니다. 그러나 내 코드로 인해 행이 오버플로됩니다.
HTML :
<div class="row">
<div class="col-md-4 section">
hello
</div>
<div class="col-md-4 section">
hello
</div>
<div class="col-md-4 section">
hello
</div>
</div>
CSS :
.section{
background-color: red;
margin-left: 5px;
margin-right: 5px;
}
.section:first-of-type{
margin-left: 0px;
margin-right: 0px;
background-color: green;
}
.section:last-of-type{
margin-left: 0px;
margin-right: 0px;
background-color: blue;
}
출력 :
Hello Hello
Hello
- 답변 # 1
관련 자료
- javascript - 여백을 사용하지 않고 li 태그 사이에 공간을 만드는 방법은 무엇입니까?
- vuejs3 - Vue 3에서 부트 스트랩 5 사용
- list - swiftui - '뒤로 버튼'과 navigationbartitle 사이의 공백을 제거하고 싶습니다
- Selenium과 Python을 사용하여 iframe간에 전환하는 방법은 무엇입니까?
- html - 부트 스트랩을 사용한 반응 형 이미지
- javascript - 두 HTML 사이에 공백 추가
- c# - 두 점 사이의 라인 렌더러 (월드 공간 없음)
- 파이썬에서 z = x + y와 z = f"{x} {y}"를 사용하는 것의 차이점은 무엇입니까?
- android - Kotlin에서 단일 표현식 fun과 var를 사용하는 것의 차이점은 무엇입니까?
- html - 자바 스크립트를 사용하여 이미지 간 전환
- html - 부트 스트랩 4 행에서 수직 공간 제거
- Bootstrap 5를 사용하는 최소 너비에 대한 클래스는 무엇입니까?
- flutter - dartfmt가 getter와 setter 사이에 공간을 남기지 않도록 방지하는 방법
- python - FOR LOOP에서 가져온 모든 데이터 사이에 공백을 두는 방법
- node.js - 나는 sequilize가 아닌 Op를 사용하고 있으며 동일한 필드 또는 그 사이에서 사용하고 싶습니다
- html - 부트 스트랩 목록 그룹을 사용하여 중간 중단 시간에 수평 이동
- sass - @use를 사용하여 부트 스트랩 scss 변수를 어떻게 참조합니까?
- html - 부트 스트랩을 사용하여 일부 행을 세로로 중앙에 배치하는 방법
- python - Pandas를 사용하여 열 간 값 정렬
- javascript - 이러한 구성 요소 사이에 일반 공간을 추가하려면 어떻게해야합니까?
관련 질문
- jquery : 부트 스트랩 캐 러셀 충돌 플렉스 슬라이더
- html : 부트 스트랩에서 드롭 다운 양식을 어떻게 만듭니 까?
- html : 선택 요소가 진행 요소를 숨기는 이유는 무엇입니까?
- html : Bootstrap을 사용하여 바닥 글 이미지 및 링크를 순서대로 정렬
- html : 드롭 다운이 이미지 뒤에 숨겨져 있습니다.
- javascript : CSS를 사용하여 상단 요소 위에 (오버레이가 아닌) 하단 요소를 정렬하는 방법
- html : Bootstrap에서 가로 스크롤 탐색을 만드는 방법은 무엇입니까?
- html : 모바일 메뉴 문제
- javascript : 모달이 열려있을 때 본문에 클래스 추가
- html : 부트 스트랩의 폼 컨트롤 팝 오버에서 필수 필드의 기본 메시지를 변경하는 방법은 무엇입니까?
부트 스트랩 V4를 사용하면
col
만 사용하여 쉽게 수행 할 수 있습니다. :