5_bootstrap之響應式佈局|列表|按鈕
5、響應式工具
為針對性地在移動頁面上展示和隱藏不同的內容,bootStrap提供響應式工具。
可以讓開發人員通過該工具決定,在何種螢幕尺寸下,隱藏或者顯示某些元素
幫助手冊位置:全域性CSS樣式---響應式工具
6、列表
BootStrap同樣提供了實用的列表樣式供開發人員使用。
幫助手冊位置:全域性CSS樣式----排版----列表
.list-inline |
將列表所有元素放置於一行 |
示例:
效果:
7、按鈕
BootStrap提供了豐富的按鈕樣式供開發人員使用。
幫助手冊位置:全域性CSS樣式----按鈕
任何HTML元素加上以下樣式都會變成對應按鈕
.btn btn-default |
示例: <a class="btn btn-default">Link</a> 效果: |
.btn btn-primary |
示例: <a class="btn btn-primary">(首選項)Primary</a> 效果: |
.btn btn-success |
示例: <a class="btn btn-success">(成功)Success</a> 效果: |
.btn btn-info |
示例: <a class="btn btn-info">(一般資訊)Info</a> 效果: |
.btn btn-warning |
示例: <a class="btn btn-warning">(警告)Warning</a> 效果:
|
.btn btn-danger |
示例: <a class="btn btn-danger">(危險)Danger</a> 效果:
|
.active |
表示按鈕被點選的樣式 示例: <a class=”btn btn-danger active”>(危險)Danger</a> 效果:
|
.disabled |
表示按鈕被禁用的樣式 示例: <a class=”btn btn-danger disabled”>(危險)Danger</a> 效果:
|