[Bootstrap] 반응 형 레이아웃에서 요소를 숨기기 > 기술자료 | 해피정닷컴

[Bootstrap] 반응 형 레이아웃에서 요소를 숨기기 > 기술자료

본문 바로가기

사이트 내 전체검색

[Bootstrap] 반응 형 레이아웃에서 요소를 숨기기 > 기술자료

HTML [Bootstrap] 반응 형 레이아웃에서 요소를 숨기기

페이지 정보


본문

부트 스트랩 v4.0.0 ~
초소형 휴대 전화  (<768px)(Class names : .visible-xs-block, hidden-xs)
대형 장치 데스크톱  (≥1200px)(Class names : .visible-lg-block, hidden-lg)
소형 장치 태블릿  (≥768px)(Class names : .visible-sm-block, hidden-sm)
중형 장치 데스크톱  (≥992px)(Class names : .visible-md-block, hidden-md)


부트 스트랩 4에는 두 가지 유형의 클래스가 있습니다.
hidden-*-up  뷰포트가 지정된 중지 점 또는 넓은 일 때 요소를 숨길 수있다.
hidden-*-down  뷰포트가 지정된 중단 점 이하일 때 요소를 숨 깁니다.


부트 스트랩 v3.2.0 ~ v4.0.0
@media (max-width: @screen-xs-max) { ... }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }
@media (min-width: @screen-lg-min) { ... }


부트 스트랩 v3.2.0 미만
초소형 휴대 전화  (<768px) (Class names : .visible-xs, hidden-xs)
소형 장치 태블릿  (≥768px) (Class names : .visible-sm, hidden-sm)
중형 장치 데스크톱  (≥992px) (Class names : .visible-md, hidden-md)
대형 장치 데스크톱  (≥1200px) (Class names : .visible-lg, hidden-lg)


참고자료
https://qastack.kr/programming/14207109/hiding-elements-in-responsive-layout
https://getbootstrap.com/docs/3.4/css/

댓글목록

등록된 댓글이 없습니다.


Total 200건 1 페이지
  • RSS
기술자료 목록
200
HTML   4530  2023-04-07 09:52 ~ 2023-04-07 09:59  
199
HTML   3598  2023-02-02 13:54 ~ 2023-02-03 06:02  
198
HTML   4642  2022-01-30 10:50 ~ 2022-01-30 22:56  
197
HTML   8890  2021-11-18 16:00  
196
HTML   5226  2021-07-07 15:48 ~ 2021-07-07 15:51  
195
HTML   6856  2021-06-02 17:15 ~ 2021-06-02 17:15  
열람
HTML   5165  2020-12-20 11:42  
193
HTML   5631  2020-09-08 23:42 ~ 2020-09-08 23:53  
192
HTML   6009  2020-06-07 18:40  
191
HTML   5946  2020-06-07 16:04 ~ 2020-12-12 09:09  
190
HTML   16315  2020-03-25 18:44 ~ 2021-09-23 18:51  
189
HTML   8210  2019-12-16 12:13 ~ 2019-12-16 12:46  
188
HTML   8966  2019-10-25 18:48 ~ 2019-10-25 18:49  
187
HTML   6942  2019-09-27 14:07 ~ 2019-09-27 14:08  
186
HTML   5382  2019-09-16 12:20  
185
HTML   5066  2019-08-11 13:03  
184
HTML   7074  2019-07-15 18:13 ~ 2019-07-15 22:48  
183
HTML   6403  2019-04-16 11:40  
182
HTML   12586  2019-04-02 00:12 ~ 2019-04-02 01:17  
181
HTML   17402  2019-01-11 23:20 ~ 2019-01-11 23:24  

검색

해피정닷컴 정보

회사소개 회사연혁 협력사 오시는길 서비스 이용약관 개인정보 처리방침

회사명: 해피정닷컴   대표: 정창용   전화: 070-7600-3500   팩스: 042-670-8272
주소: (34368) 대전시 대덕구 대화로 160 대전산업용재유통단지 1동 222호
개인정보보호책임자: 정창용   사업자번호: 119-05-36414
통신판매업신고: 제2024-대전대덕-0405호 [사업자등록확인]  
Copyright 2001~2024 해피정닷컴. All Rights Reserved.