第一次接觸神奇的Bootstrap導航條

2022-10-06 18:18:08 字數 740 閱讀 1855

導航條(n**bar)在bootstrap中是乙個獨立元件,導航條(n**bar)和導航(n**)在bootstrap中是有明顯的區別的。在導航條(n**bar)中有乙個背景色、而且導航條可以是純鏈結、表單、表單和導航一起結合等多種形式。

1.實戰一-帶二級選單和表單的導航條

導航條css/bootstrap.min.css">

標題

效果圖如下:

bootstrap的導航條中除了使用n**bar-brand中的a元素和n**bar-n**的ul和n**bar-form之外,還可以使用其他元素:

1)導航條中的按鈕n**bar-btn

2)導航條中的文字n**bar-text

3)導航條中的普通鏈結n**bar-link

2.實戰二-固定導航條

標題

標題網頁正文內容

效果圖如下:

3.實戰三-響應式導航條

標題

效果圖如下:

有的時候會有需要反色的情況,bootstrap為此提供了反色導航條,只是將n**bar-deafult類名換成n**bar-inverse,然後導航條的背景色和文字的顏色就會修改。

4.實戰四-分頁導航

1)帶頁碼的分頁導航

效果圖如下:

2)翻頁分頁導航

效果圖如下:

本文標題: 第一次接觸神奇的bootstrap導航條

本文位址: /ruanjian/j**a/159837.html

第一次接觸神奇的Bootstrap網格系統

本篇將主要介紹bootstrap的網格系統。網格系統的實現是通過定義容器大小,平分12份 或24份 32份,但12份是最常見的 再調整內外邊距,最後結合 查詢,就製作出了強大的響應式網格系統。bootstrap中的網格系統就是將容器平分成12份。bootstrap的網格系統用來布局,其實就是列的組合...

第一次接觸ruby

part one afile file.new e calog.cfu w afile.puts rtwe calllog configuration file afile.puts rerew 2.0 calog afile.puts 日誌的根路徑 afile.puts base path e l...

第一次接觸ubuntu

第一次接觸ubuntu好激動 1.進入 退出命令列介面 alt ctrl f1 進入命令列介面 alt ctrl f7 退出命令列介面 2.安裝wine sudo apt get install wine使用 終端命令就是 wine 舉個例子,你現在要執行魔獸,然後你的魔獸的資料夾的位置是 home...