導航欄是網頁中常用的模組,有很多方法可以實現,下面是用css實現的方法:
css**如下:
#menu
/*利用padding:20px 20px 0 0來固定選單位置*/
#menu ul
/*新增了float:right使得選單位於頁面右側*/
#menu ul li
/*加選單間的豎線*/
.menudiv
/*定義選單鏈結的樣式*/
#menu ul li a:link,#menu ul li a:visited
#menu ul li a:hover{}
解釋一下:
、這兩個html元素它們最主要的作用就是在html中以列表的形式來顯示一些資訊。
當在html中定義為id="divid"時,在css對應的設定語法則是#divid{} ,如果在html中定義為class="divid"時,則在css中對應的設定語法是.divid
#menu ul
list-style:none,這一句是取消列表前點,因為我們不需要這些點。
margin:0px,這一句是刪除ul的縮排,這樣做可以使所有的列表內容都不縮排。
#menu ul li
這裡的 float:left 的左右是讓內容都在同一行顯示,因此使用了浮動屬性(float)。
margin:0 10px的作用就是讓列表內容之間產生乙個20畫素的距離(左:10px,右:10px)
display:block;line-height:28px的作用是讓文字垂直居中
CSS學習之建立乙個簡單的導航欄
note top.html 雖然是做後端的,但是對css很感興趣,做了個簡單的導航欄,很簡單的說。希望以後能夠做複雜一些,要多努力!首頁 a li li a href class current page item 首頁 a li li a href 首頁 a li li a href 首頁 a l...
簡單說 用CSS做乙個魔方旋轉的效果
魔方大家應該是不會陌生的,這次我們來一起用css實現乙個魔方旋轉的特效,先來看看效果圖!我們要做這樣的效果,重點在於怎麼把6張,擺放成魔方的樣子,而把它們擺放成魔方的樣子,重點在於用好css的transform,這是非常重要的,好的,我們先拼出乙個魔方的樣子。效果圖 比較長,朋友們可以直接貼上複製到...
用redis做乙個簡單的秒殺
下面是乙個簡單的下單操作 include mmysql.class.php configarr host port user passwd dbname db new mmysql configarr sql select from sdb b2c products where product id...