快捷導(dǎo)航

Bootstrap CSS布局之代碼

更新時(shí)間：2016年12月17日 09:16:28 作者：github_34514750

這篇文章主要介紹了Bootstrap CSS布局之代碼的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

Bootstrap對(duì)代碼顯示提供了三種方式：內(nèi)聯(lián)代碼

1.使用 元素顯示單行內(nèi)聯(lián)代碼

內(nèi)聯(lián)代碼主要是設(shè)置code元素的背景顏色和其內(nèi)部的文字顏色。

//用法
<code>&lt;body&gt;&lt;/body&gt;</code>

//源碼
code {
 padding: 2px 4px;
 font-size: 90%;
 color: #c7254e;
 background-color: #f9f2f4;
 border-radius: 4px;
}

2.使用 元素顯示用戶輸入代碼

元素包含的內(nèi)容是表示該內(nèi)容需要用戶鍵盤(pán)輸入，所以一般是設(shè)置成input 的效果，用法和code類似

//用法
<pre>
&lt;article&gt;
  &lt;h1&gt;Article Heading&lt;/h1&gt;
&lt;/article&gt;
</pre>

//源碼
kbd {
 padding: 2px 4px;
 font-size: 90%;
 color: #fff;
 background-color: #333;
 border-radius: 3px;
 -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
     box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
}

3.使用

元素新生多行代碼塊，代碼需要被顯示為一個(gè)獨(dú)立的塊元素或者代碼有多行，那么您應(yīng)該使用標(biāo)簽。

//用法
<pre>
&lt;article&gt;
  &lt;h1&gt;Article Heading&lt;/h1&gt;
&lt;/article&gt;
</pre>

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

利用JavaScript實(shí)現(xiàn)繪制2023新年煙花的示例代碼
大家過(guò)年好！新春佳節(jié)，在這個(gè)充滿喜悅的日子里，愿新年的鐘聲帶給你一份希望和期待。在這喜慶的日子里，小編和大家分享一個(gè)煙花代碼，希望大家能夠喜歡
2023-01-01
Bootstrap fileinput組件封裝及使用詳解
這篇文章主要介紹了Bootstrap fileinput組件封裝及使用的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-03-03
JS實(shí)現(xiàn)霓虹燈文字效果的方法
這篇文章主要介紹了JS實(shí)現(xiàn)霓虹燈文字效果的方法,涉及javascript遍歷字符串及頁(yè)面樣式的動(dòng)態(tài)操作技巧,效果非常炫目華麗,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-08-08
JS簡(jiǎn)單實(shí)現(xiàn)數(shù)組去重的方法分析
這篇文章主要介紹了JS簡(jiǎn)單實(shí)現(xiàn)數(shù)組去重的方法,結(jié)合具體實(shí)例形式分析了javascript數(shù)組遍歷、判斷實(shí)現(xiàn)去重復(fù)的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下
2017-10-10
js設(shè)置document.domain實(shí)現(xiàn)跨域的注意點(diǎn)分析
這篇文章主要介紹了js設(shè)置document.domain實(shí)現(xiàn)跨域的注意點(diǎn),較為詳細(xì)的分析了document.domain跨域的相關(guān)技巧,需要的朋友可以參考下
2015-05-05
JavaScript中通過(guò)提示框跳轉(zhuǎn)頁(yè)面的方法
這篇文章主要介紹了JavaScript中通過(guò)提示框跳轉(zhuǎn)頁(yè)面的方法的相關(guān)資料,需要的朋友可以參考下
2016-02-02
JS動(dòng)態(tài)添加Table的TR，TD實(shí)現(xiàn)方法
這篇文章主要介紹了JS動(dòng)態(tài)添加Table的TR，TD實(shí)現(xiàn)方法,涉及js針對(duì)Table中TR、TD節(jié)點(diǎn)的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-01-01
ie與ff下的event事件
event是ie自帶的一個(gè)對(duì)象，而ff中不存在該對(duì)象，只能通過(guò)傳遞參數(shù)的方式來(lái)模擬event，：（
2009-09-09
js閉包和垃圾回收機(jī)制示例詳解
這篇文章主要給大家介紹了關(guān)于js閉包和垃圾回收機(jī)制的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2021-03-03
Javascript字符串拼接小技巧(推薦)
下面小編就為大家?guī)?lái)一篇Javascript字符串拼接小技巧(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-06-06