부트스트랩 5열 그리드
첨부파일 https://eond.com/coding/395372
부트스트랩의 그리드 시스템은 12개의 분할된 화면으로 레이아웃을 구성하는 것입니다.
5개씩 하려고 하면 안되는 부분이 있는데 이렇게 추가가 가능합니다.
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
패딩값은 10px이나 15px 이나 알아서 설정하세요.

.col-xs-15 {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}


추가로 1/5 외에 2/5, 3/5, 4/5도 아래와 같이 추가가 가능합니다.

.col-xs-25 {
width: 40%;
float: left;
}

.col-xs-35 {
width: 60%;
float: left;
}

.col-xs-45 {
width: 80%;
float: left;
}

출처 
https://code.i-harness.com/ko/q/9e811c
https://blog.polarbits.co/2014/02/16/quick-tips-5-column-layout-with-twitter-bootstrap/

코멘트 0
접기/펴기 | 댓글 새로고침
 
 
Total 221 articles in 1 / 12 pages
번호 제목 제목 날짜날짜
공지 코딩 배울 수 있는 사이트 모음(HTML/CSS/JS/IMG/PHP) 2018/01/03
공지 jQuery를 배울수 있는 동네들입니다. 2013/08/09
공지 관련 링크 [1] 2010/05/23
220 [프레임워크] Material design 2020/07/02
219 Web Fundamentals 2020/05/02
218 [반응형 웹] 기기별 미디어쿼리 사이즈,모바일 디바이스별 사이즈 파일 2020/05/02
217 [반응형 웹] 모바일 사이드바 만들기 2020/04/10
216 [프레임워크] [UI Kit] CSS Framework 어떤 것을 사용할 것인가? 출처: https://mobicon.tistory.com/353 [Intelligence Convergence] 파일 2019/03/21
215 [프레임워크] Bootstrap Customize Site 2018/08/30
214 [프레임워크] Bootstrap VS Bulma 파일 2018/08/29
213 [프레임워크] Bulma CSS Framework Customize with PHPStorm 2018/08/27
212 [프레임워크] 비밀글 Bulma Customizing 2018/08/27
211 [프레임워크] BULMA CSS 프레임워크 2018/08/19
210 [프레임워크] 베스트 10 리액트 UI 라이브러리(10 Best React UI Library) 파일 2018/05/27
209 [프레임워크] 설계 노하우: UI 컴포넌트 파일 2018/05/27
208 [프레임워크] 자주 사용되는 UI 패턴(컴포넌트) 과 UI 레이아웃 2018/05/27
207 [프레임워크] 재사용 UI 컴포넌트 설계 (by SK Planet FE개발자 윤지수, 2016/04/04) 2018/05/27
206 [프레임워크] JUI Framework 2018/05/27
205 [부트스트랩] Bootstrap 3 offset on right not left 2018/04/17
204 [HTML5] HTML5 New Elements - New Semantic/Structural Elements 2018/01/07
203 [프레임워크] uikit 파일 2017/12/27
현재글 [부트스트랩] 부트스트랩 5열 그리드 2017/12/20

해시태그 디렉터리