Bootstrap CSS 排版參考
Bootstrap 的預設設定
Bootstrap 的全域性預設字型大小為 14px,行高為 1.428。
這適用於 <body> 和所有段落。
此外,所有 <p> 元素的底部邊距等於其計算行高的一半(預設情況下為 10px)。
排版
下面的元素將比瀏覽器預設樣式具有略微不同的樣式。檢視“嘗試一下”示例以檢視結果/差異。
下面的類用於進一步設定元素的樣式。
元素/類 | 描述 | 示例 |
---|---|---|
<h1> - <h6> 或 .h1 - .h6 |
h1 - h6 標題 | 試一試 |
<small> | 在任何標題中建立較淺、次要的文字標題 (次要文字) |
試一試 |
.small | 表示較小的文字(設定為父大小的 85%):較小文字 | 試一試 |
.lead | 使文字脫穎而出:醒目的文字 | 試一試 |
<mark> 或 .mark |
突出顯示文字:高亮文字 | 試一試 |
<del> | 表示已刪除的文字: |
試一試 |
<s> | 表示不再相關的文字: |
試一試 |
<ins> | 表示已插入的文字:已插入文字 | 試一試 |
<u> | 表示下劃線文字:下劃線文字 | 試一試 |
<strong> | 表示粗體文字:粗體文字 | 試一試 |
<em> | 表示斜體文字:斜體文字 | 試一試 |
.text-left | 表示左對齊文字 | 試一試 |
.text-center | 表示居中文字 | 試一試 |
.text-right | 表示右對齊文字 | 試一試 |
.text-justify | 表示兩端對齊文字 | 試一試 |
.text-nowrap | 表示不換行文字 | 試一試 |
.text-lowercase | 表示小寫文字:小寫文字 | 試一試 |
.text-uppercase | 表示大寫文字:大寫文字 | 試一試 |
.text-capitalize | 表示首字母大寫文字:首字母大寫文字 | 試一試 |
<abbr> | <abbr> 元素表示縮寫或首字母縮略詞。帶有 title 屬性的縮寫在懸停時顯示虛線下邊框和幫助游標,在懸停時提供額外上下文。 | 試一試 |
.initialism | 以略小的字型大小顯示 <abbr> 元素中的文字 | 試一試 |
<address> | 展示聯絡資訊 | 試一試 |
<blockquote> | 表示來自另一來源的內容塊 | 試一試 |
.blockquote-reverse | 表示右對齊內容的塊引用 | 試一試 |
<ul> | 表示無序列表 | 試一試 |
<ol> | 表示有序列表 | 試一試 |
.list-unstyled | 刪除列表項的預設列表樣式和左邊距(適用於 <ul> 和 <ol>)。此類僅適用於直接子列表項(要刪除任何巢狀列表的預設列表樣式,請將此類也應用於任何巢狀列表) | 試一試 |
.list-inline | 將所有列表項放在單行上 | 試一試 |
<dl> | 表示描述列表 | 試一試 |
.dl-horizontal | 將 <dl> 元素中的術語和描述並排放置。它開始時就像預設的 <dl>,但在瀏覽器視窗展開時,它們會並排放置 | 試一試 |
程式碼
元素/類 | 描述 | 示例 |
---|---|---|
<var> | 表示變數:x = ab + y | 試一試 |
<kbd> | 表示通常透過鍵盤輸入的輸入:CTRL + P | 試一試 |
<pre> | 表示多行程式碼 | 試一試 |
<pre class="pre-scrollable"> | 帶捲軸的多行程式碼 | 試一試 |
<samp> | 表示計算機程式的示例輸出:示例輸出 | 試一試 |
<code> | 表示內聯程式碼片段:span , div |
試一試 |