설명시 개념과 어떻게 사용하는지에 대한 설명이 더 자세 했으면 합니다.
169
작성한 질문수 6
gutter, break설명시
개념과 어떻게 사용하는지에 대한 설명이 더 자세 했으면 합니다.
개념 설명이 명확하지 않고 시현만 하고
이해 되시죠 하고 묻고 가는데 솔직히 이해가 되지 않습니다.
(설명이 충실하지 않으니 다시 부트스트랩 문서보고, 인터넷 찾아야 됩니다,)
w-100이 무엇을 의미하는지 설명을 더 해주면 좋을 듯 합니다.
g- 부분도 마찬가지이구요
답변 1
1
안녕하세요.
1. gutter 부분은 부트스트랩의 column 사이의 padding이 포함된 그리드 개념입니다.
보통 .row 밑에 컬럼들 예컨대 .col 또 .col이 있다면 이 두 개의 .col-6은 붙어있게 되는데요,
.row에 gx-* 클래스를 추가하면 개별 컬럼 속에 padding이 추가되는 것인데,
대신에 그 상위 클래스 .container에 px-4같은 클래스를 넣어줘야 해서
아직까지는 그리 많이 사용되는 클래스는 아닙니다.
또한 컬럼에서 gx-*라면 수평으로, gy-*라면 수직으로 여백이 생겨서 불편한 점도 있구요.
그냥 .col-* 다음 px-* 또는 py-* 클래스를 추가하는 것이 좀 더 나을 것 같습니다만...
2. w-100은 css에서 width: 100%;와 같은 개념의 부트스트랩 클래스입니다.
w-auto와 거의 비슷한데
다만 w-auto 클래스(즉, width: auto;)는 margin이나 padding 그리고 border를 포함하지 않구요,
w-100 클래스는(width: 100%;)는 포함되는 개념입니다.
동영상 설명 중에 부족하다고 느끼신 부분에 대해서는 죄송하게 생각합니다. 다만, 그렇게 중요하지 않은 것 같아서 간략히 넘어간 부분도 있습니다. 추후에 업그레이드를 할 때 지적에 대해서는 좀 더 부연설명을 할 수 있도록 하겠습니다.
감사합니다.
services-col mx-2 my-3
0
67
2
단축키 질문
0
63
1
부트스트랩 + *.css 함께 사용하는 이유와 분리 기준이 궁금합니다.
0
303
2
프로젝트3의 툴팁에서
1
337
2
프로젝트1 번의 Navigation 강의부에서 질문입니다.
0
371
1
게시판을 추가할 수 있는 방법이 있을까요?
0
735
1
프로젝트 2 이미지 깨짐 현상
0
1187
1
프로젝트 1- Service Section 에서 app.js에서 syntaxError가 납니다.
0
306
1
자식에 position:absolute;를 쓰지 않고, 바로 top 설정이 가능한가요?
0
364
2
cdn.js를 실제 프로젝트에 써도 문제가되지 않나요!?
0
533
1
carousel 구현에서 사용된 아이디가 중복 사용 가능한가요?
0
375
1
kakao map이 mobile에서도 가능하게 하려면 어떻게 할까요?
0
316
1
-webkit- 접두어가 안붙습니다.
0
405
1
브레이크 포인트 관련 문의
0
268
1
a:hover {color }
2
470
4
Post Content -2 질문
0
208
1
아니 선생님 이게 뭡니까 프로젝트3 Blog CTA Modal 파트
0
330
2
hover
0
329
1
box 공부중 질문있습니다
0
341
3
뭐가 잘못 된지 모르겠습니다.
0
302
2
강의보고 따라하는데 안됩니다.
0
310
3
3:10 -> 3:16 코드 질문 있습니다^^
0
289
2
card와 card-body 의 차이점
0
694
2
px-md-3
0
383
2





