-
xs ＜768 sm 768-992 md 992-1200 lg >1200 柵格布局，頁面分為12份 命令：col-xs-3 占3分 命令：col-xs-offset-3 表示左邊距占 3分查看全部
-
手機 小于 768 平板 768-992 電腦 大于992查看全部
-
【Bootstrap中的表格】
?.table ：基礎表格
?.table-striped 條紋 、斑馬線表格
?.table-bordered 帶邊框
?.table-hover? 鼠標懸停高亮
?.table-condensed 緊湊型
?.table-responsive：響應式表格
.danger 紅色?
.warning 黃色?
.info 藍色?
.success 綠色
?.active 懸停時顏色
查看全部 -
【Bootstrap中的排版】
【文本】
段落：p標簽——默認：14px;行高：20px；底部外邊距：10px
【對齊】
.text-left，給指定段落添加該類名，產生左對齊效果
.text-center
.text-right
【大小寫】
.text-lowercase，將指定內容添加該類名，轉換其中大寫字母為小寫樣式
.text-uppercase
.text-capitalize，首字母大寫（每個獨立單詞的）
【標簽】
<mark>強調文字，底邊變黃</mark>
<del>刪除文字，中間有橫線</del>
<ins>標記插入，下劃線</ins>
<u>下劃線</u>
<small>副標題，文字變小，字體比標簽外的字體變小</small>
<strong>標簽加粗字體</strong>
查看全部 -
<!DOCTYPE?html> <html>? ?????<head>??? ?????????<meta?charset="UTF-8">??? ?????????<meta?http-equiv="X-UA-Compatible"?content="IE=edge">?? ?????????<meta?name="viewport"?content="width=device-width,?initial-scale=1">??? ?????????<title>標題</title>??? ?????????<link?rel="stylesheet"?>???? ?????????<script?src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>?? ?????????<script?src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> ????</head>? ????<body> ????????<h1>biaoti<small>biaoti</small></h1> ????????<h2>biaoti</h2> ????????<h3>biaoti</h3> ????????<h4>biaoti</h4> ????????<h5>biaoti</h5> ????????<h6>biaoti</h6> ???????? ????????<span?class="h1">biaoti</span> ????????<span?class="h2">biaoti</span>
查看全部 -
【Bootstrap中的排版】--【標題】
Bootstrap對默認的排版方式進行了CSS樣式定義，使得各種基本結構套用出來的HTML頁面更加美觀。
標題：（h1~h6都能使用，而.h1~.h6類名能為內聯元素賦予標題的樣式）
字體大小皆為：
h1:36px;
h2:30px;
h3:24px;
h4:18px;
h5:14px;
h6:12px;
副標題：（small）,h標簽內用<small>標簽圈定副標題的內容即可
查看全部 -
【Bootstrap中的全局樣式】
一、特點：
①代碼整潔；
②風格統一；
③美觀易用；
Bootstrap提供了大量的全局樣式，基本的HTML元素均可以通過class設置樣式并得到增強效果。
排版、表格、表單、圖片
查看全部 -
【bootstrap環境搭建】?
1、必須的文件 bootstrap.min.css 、bootstrap.min.js 和 jquery
2、例：
?<!DOCTYPE html>
?<html lang="en">?
????<head>
?????????<meta charset="UTF-8" />
?????????<title>Bootstrap</title>?
????????<link rel="stylesheet" href="css/bootstrap.min.css" >
?????????<script src="js/jquery-1.7.2.min.js"></script>
?????????<script src="js/bootstrap.min.js"></script>
?<!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <script src="js/respond.min.js"></script> <![endif]-->
? </head>
? <body>
?????????<div class="text-center">?
????????????????<h1>Hello World!</h1>?
????????????????<button type="button" class="btn btn-primary btn-lg">我是按鈕，按我一下！</button>
?????????</div>?
????</body>?
</html>
查看全部 -
【Bootstrap的特性】
響應式設計、柵格布局、完整的類庫
JQuery插件、不同的使用場景
【Jetstrap】
專門針對Bootstrap的開發工具：Jetstrap
地址：jetstrap.com
【Btootstrap下載地址】
中文地址：www.bootcss.com
查看全部 -
bootstrap全局樣式用法
viewport的意義
柵格化布局用法
字體，圖標
實現響應式布局的開發
查看全部 -
全局樣式h1~h6 /.h1~.h6
查看全部 -
進入bootstrap中文網站點bootstrap3.0中文文檔進行下載如上圖查看全部 -
專門針對Bootstrap的開發工具：Jetstrap
地址：jetstrap.com
Btootstrap下載地址
中文地址：www.bootcss.com
查看全部 -
toggle?查看全部
-
別人家的屏幕頭部用js生成meta查看全部
舉報