>웹 프론트엔드 >HTML 튜토리얼 >Bootstrap栅格布局系统的特点_html/css_WEB-ITnose

Bootstrap栅格布局系统的特点_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-24 11:32:221354검색

栅格布局系统的特点:

 (1)所有的行必须放在容器中: .container或.container-fluid

 (2)分为多行(row),一行中平均分为12列(col)

 (3)网页内容只能放在列(col)中,不能直接放在行(row)

 (4)可以在col中再嵌套row

 (5)col分为四大类: col-xs   col-sm    col-md   col-lg

 (6)col-md-*  *值可为1~12,值就为某个列的宽度(  */12  )

 (7)可以为一个列指定不同屏幕下的不同宽度

 (8) col-lg-*  只对大PC屏幕有效

    col-md-*   对普通PC和大PC屏幕都有效

    col-sm-*   对平板、PC、大PC屏幕都有效

    col-xs-*   对手机、平板、PC大PC屏幕都有效

 (9)  .hidden-lg    当前列只在大PC屏幕下隐藏

.hidden-md 当前列只在PC屏幕下隐藏

.hidden-sm 当前列只在平板屏幕下隐藏

.hidden-xs 当前列只在手机屏幕下隐藏

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.