sidr 為網頁新增側邊滑出選單欄

2021-07-24 07:35:17 字數 767 閱讀 7449

src="sources/js/jquery-3.1.1.min.js">

script>

src="sources/js/jquery.sidr.js">

script>

rel="stylesheet"

href="sources/css/jquery.sidr.light.min.css">

其中最後乙個是主題檔案。使用方法,以右側選單為例

id="right-menu"

href="#sidr">

a>

id="sidr"

style="display: none;">

內容選項h2>

href="#">1a>

li>

href="#">2a>

li>

href="#">3a>

li>

href="#">4a>

li>

ul>

div>

在側滑選單中,如果你要新增按鈕或者其他html元素,你會發現很多效果都失效了,此時你需要去修改他的主題檔案jquery.sidr.light.min.css或者jquery.sidr.dark.min.css。如果你使用白色背景的修改前者,使用黑色的就要修改後者,如新增button的格式

.sidr

button

更改各個選項和或者其它元素照此修改即可。更改此檔案也可以更改適合你的背景色

為網頁新增樣式

h1id選擇器 id 元素選擇器 元素 類選擇器 class 萬用字元選擇器 內部樣式表 書寫在style元素中 內聯樣式表 直接書寫在元素的style屬性中 外部樣式表 推薦 外部樣式可以解決多頁面樣式重複的問題 有利於遊覽器快取,從而提高頁面響應熟讀 有利於 分離 html和css 更容易閱讀和...

CSS 為網頁新增樣式

css全稱為 層疊樣式表 cascading style sheets 它主要是用於定義html內容在瀏覽器內的顯示樣式,如文字大小 顏色 字型加粗等。如下列 p使用css樣式的乙個好處是通過定義某個樣式,可以讓不同網頁位置的文字有著統一的字型 字型大小或者顏色等。為什麼使用css樣式來設定網頁的外...

為網頁新增浮動廣告

漫遊於網路之間,你會發覺,網際網路不但是資訊的海洋,也是廣告的海洋。除了普通的gif banner flash外,浮動廣告也是時下網上較為流行的廣告形式之一。當你拖動瀏覽器的滾動條時,這種在頁面上浮動的廣告,可以跟隨螢幕一起移動。儘管這種效果對於廣告展示有相當的實用價值,但對瀏覽你網頁的人來講,這則...