国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

15158846557 或 在線咨詢 在線咨詢
15158846557 或 在線咨詢
所在位置： 首頁 > 營(yíng)銷資訊 > 網(wǎng)站運(yùn)營(yíng) > 前端：使用BootStrap搭建一個(gè)簡(jiǎn)單的網(wǎng)頁

前端：使用BootStrap搭建一個(gè)簡(jiǎn)單的網(wǎng)頁

時(shí)間：2023-06-09 19:15:01 | 來源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-06-09 19:15:01 來源：網(wǎng)站運(yùn)營(yíng)

前端：使用BootStrap搭建一個(gè)簡(jiǎn)單的網(wǎng)頁：之前有想法學(xué)習(xí)一下前端框架的，后來沒有堅(jiān)持下來。連最基礎(chǔ)的柵格系統(tǒng)都忘記了。于是，花了一點(diǎn)時(shí)間，重新溫習(xí)了一下。寫了一個(gè)簡(jiǎn)單的網(wǎng)頁。頁面大致是下面這張圖。做得比較一般，不過能夠自適應(yīng)各種設(shè)備大小了。

說下制作過程吧，首先下載bootstrap提供的css,js文件，（之前看文檔的時(shí)候，直接引用了CDN，不知道什么原因，用了沒效果。），在html代碼里引用這些文件。

接下來，就是制作網(wǎng)頁的過程。要實(shí)現(xiàn)自適應(yīng)網(wǎng)頁，首先要加入這段代碼

<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">然后，要明白柵格系統(tǒng)的使用。

網(wǎng)頁是分成12份的，對(duì)應(yīng)不同的屏幕，使用不同的柵格系統(tǒng)類前綴。比如在<768px的時(shí)候，使用.col-xs-，根據(jù)你需要在哪些屏幕中顯示，使用不同的類前綴。<class = "col-xs-3">,<class = "col-xs-9">這樣就表示一行分成了3份和9份。

注意的是，柵格系統(tǒng)要在container和row類中使用，具體使用可以參考官網(wǎng)的技術(shù)文檔來寫。bootstrap3和bootstrap4有些不同，一定要注意了，比如響應(yīng)式圖片，一個(gè)是用.img-responsive，一個(gè)是用.img-fluid的。

總結(jié)一下，使用bootstrap來寫網(wǎng)頁的話，調(diào)用已經(jīng)寫好的css,js框架。很快就可以寫出一個(gè)漂亮的網(wǎng)頁，當(dāng)然，要熟悉掌握各個(gè)類的使用，還是需要花費(fèi)一些時(shí)間。

關(guān)鍵詞：簡(jiǎn)單,使用

74
73
25
news

版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。

為了最佳展示效果，本站不支持IE9及以下版本的瀏覽器，建議您使用谷歌Chrome瀏覽器。 點(diǎn)擊下載Chrome瀏覽器
關(guān)閉