Bootstrap <基礎三十>Well
Well 是一種會引發內容凹陷顯示或插圖效果的容器 <div>。爲了建立 Well，只須要簡單地把內容放在帶有 class .well 的 <div> 中便可。下面的實例演示了一個默認的 Well：
<!DOCTYPE html> <html> <head> <title>Bootstrap 實例 - 默認的 Well</title> <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <script src="/scripts/jquery.min.js"></script> <script src="/bootstrap/js/bootstrap.min.js"></script> </head> <body> <div class="well">您好，我在 Well 中！</div> </body> </html>
結果以下所示：css
尺寸大小
您可使用可選類 well-lg 或 well-sm 來改變 Well 的尺寸大小。這兩個類是與 .well 類結合使用的。這兩個類會影響內邊距（padding），根據使用的類，Well 會顯示得更大或者更小。html
<!DOCTYPE html> <html> <head> <title>Bootstrap 實例 - Well 的尺寸大小</title> <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <script src="/scripts/jquery.min.js"></script> <script src="/bootstrap/js/bootstrap.min.js"></script> </head> <body> <div class="well well-lg">您好，我在大的 Well 中！</div> <div class="well well-sm">您好，我在小的 Well 中！</div> </body> </html>
結果以下所示：jquery
相關文章
- 1. Bootstrap<基礎十三> 按鈕組
- 2. Bootstrap<基礎十七>導航欄
- 3. Bootstrap <基礎十九>分頁
- 4. Bootstrap<基礎二十> 標籤
- 5. Bootstrap<基礎三> 排版
- 6. Bootstrap <基礎三十一>插件概覽
- 7. Bootstrap <基礎二十三>頁面標題（Page Header）
- 8. Bootstrap <基礎三十二>模態框（Modal）插件
- 9. Bootstrap<基礎六> 表單
- 10. Bootstrap<基礎四> 代碼
- 更多相關文章...
- • Kotlin 基礎語法 - Kotlin 教程
- • Scala 基礎語法 - Scala教程
- • RxJava操作符（十）自定義操作符
- • Kotlin學習（二）基本類型
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. 安裝cuda+cuDNN
- 2. GitHub的使用說明
- 3. phpDocumentor使用教程【安裝PHPDocumentor】
- 4. yarn run build報錯Component is not found in path 「npm/taro-ui/dist/weapp/components/rate/index「
- 5. 精講Haproxy搭建Web集羣
- 6. 安全測試基礎之MySQL
- 7. C/C++編程筆記：C語言中的複雜聲明分析，用實例帶你完全讀懂
- 8. Python3教程(1)----搭建Python環境
- 9. 李宏毅機器學習課程筆記2：Classification、Logistic Regression、Brief Introduction of Deep Learning
- 10. 阿里雲ECS配置速記
歡迎關注本站公眾號,獲取更多信息
