首頁  >  文章  >  web前端  >  bootstrap預設字體大小是多少

bootstrap預設字體大小是多少

WBOY
WBOY原創
2022-08-22 16:34:512912瀏覽

bootstrap預設字體大小是「14px」;Bootstrap是一個基於HTML、CSS、JavaScript的開源框架,用於快速建立基於PC端和行動裝置的響應式web頁面,並且預設的行高為“20px”,p元素行高為“10px”。

bootstrap預設字體大小是多少

本教學操作環境:Windows10系統、bootstrap5版、DELL G3電腦

bootstrap預設字型大小是多少

bootstrap的全域預設字體大小為14px

Bootstrap是一個基於HTML CSSJavaScript的開源框架,用於快速建立基於PC端和行動裝置的響應式web頁面

bootstrap頁面排版

1.Bootstrap中預設的字體大小為14px,(Nativeapp字體預設為17)行高為20px,e388a4556c0f65e1904146cc1a846bee元素為1/2行高(10px)顏色為#333

2.標題:h1~h6(36px,30px,24px,18px,14px,12px)

3.h標籤下可以嵌套d015d241ae6d34c34210679b5204fe85標籤,通常作為副標題使用,h1~h3下:small元素的大小只佔父元素的65%(23.4px,19.5px,15.6px),h4~h6下:small元素只佔父元素的75%(13.5px,10.5px,9px),small標籤的顏色是淺灰色:#777,行高為1,粗度為400.

4.內嵌文字元素

新增標記:f920514e6447cf1d171079d1371f007f//e388a4556c0f65e1904146cc1a846bee聽眾朋友大家好,這裡是f920514e6447cf1d171079d1371f007f中央人民廣播電視台ee15d5864733761b2441a93ca4c07fdb94b3e26ee717c64999d7867364b1b4a3

刪除文字:823db3943044a0a9a620ada8d4b1d965//823db3943044a0a9a620ada8d4b1d965我都賣完了你才來f6236f917cb4ada62f5c34ba44124864

無用文字:2e44d2d3284d23d932e1fd85f3d4cf3a//2e44d2d3284d23d932e1fd85f3d4cf3a我跟刪除長一樣但是我真無用6cf51b1709551acbf4a696702deda05f

插入文字:426be984ffbbb815d7d88e3543a85d91//426be984ffbbb815d7d88e3543a85d91我是插入文字27009e947c4a250442478f8c8f213901

強調文字:d015d241ae6d34c34210679b5204fe85,27009e947c4a250442478f8c8f213901

強調文字:d015d241ae6d34c34210679b5204fe85,< ;strong>,907fae80ddef53131f3292ee4f81644b

//<small>我是标准字号的85%</small>
//<strong>我是加粗的:700</strong>
//<em>我用的很多,因为我是歪的</em>

5.對齊

<p class=’text-left’>我居左对齐</p>
<p class=’text-center’>我居中对齐</p>
<p class=’text-right’>我居右对齐</p>
<p class=’text-justify’>我两端对齐,但是我支持度不高</p>
<p class=’text-nowrap’>我不换行</p>

6.大小寫

<p class=’text-lowercase’>小写</p>
<p class=’text-uppercase’>大写</p>
<p class=’text-capitalize’>首字母大写</p>

7.地址文字

//地址文本对原本的css样式做的复写,去掉了倾斜,设置了行高
<address>
<strong>132132集团</strong>
<p>电话:<small>(0232)1231321313</small><p>
</address>

8.引用文字

//左边有一个5px的边框线条
<blockquote>看看我左边</blockquote>
<blockquote class=’blockquote-reverse’>又在右边了</blockquote>
<blockquote class=’pull-right’>同上</blockquote>

9.列表排版

//默认样式
<ul>
<li>测试</li>
<li>测试</li>
<li>测试</li>
</ul>
 
//移除默认样式
<ul class=’list-unstyled’>
<li>测试</li>
<li>测试</li>
<li>测试</li>
</ul>
 
//设置成内联
<ul class=’list-inline’>
<li>测试</li>
<li>测试</li>
<li>测试</li>
</ul>
相關推薦:

bootstrap教程#######

以上是bootstrap預設字體大小是多少的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn