二級選單的製作

2021-07-09 18:59:41 字數 872 閱讀 9101

閒話不多扯,前兩天學了二級選單的製作,豎形的耳機選單和橫形的二級選單,每種效果做了兩個demo。 其實這是前天做的,但是因為一些事情,現在才貼上來,,給各位新人分享一下,有什麼問題請指正。謝謝。

一, 豎形的二級選單。

效果如下: (如果豎起來,好像在豎中指,o(∩_∩)o)

**部分:

夏天秋天冬天

其中用了相對定位和絕對定位把二級選單相對於對應的一級選單固定。 (一級選單的li元素設定相對定位,沒有left top值,二級選單的li設定相對於一級選單li 的絕對定位,left:(一級選單的寬度)px; top:0px.)。其實,我發現我現在做一些布局頻繁的使用float和定位,不知道這是不是正確的,但是總覺得心裡慌慌的,就像是玩了個小把戲就做出了效果一樣。如果各位網友在布局方面有更好的建議,煩請指教。

二, 橫形二級選單的製作。

效果如下。

**部分:

amet consectetur  

adipiscin elit  

cras suscipit lacus  

dapibus ante mattis  

adipiscing nibh placerat

cras bibendum  

porta diam elit

adipiscing nibh placerat

cras bibendum

porta diam elit

對於橫形的二級選單的製作,只是相對於豎形改了一點點。 讓一級選單li左飄浮,然後二級選單li元素相對於一級選單絕對定位。

二級選單的製作與使用(1)

2021年7月,正式開始了產品經理的新路歷程,初涉產品經理崗位,選單製作佔據了我不少時間去搞定,二級選單是常見的操作樣式,為避免緊急情況下不知如何操作,記錄如下 效果如圖 一 用到的元件 axure 9.0元件庫中的矩形 阿里巴巴向量圖示庫中搜尋的一級選單圖示及向下箭頭。二 一級選單製作 使用滑鼠將...

CSS二級選單

最近的 要求使用二級選單,本著 能用別人的就用別人的,不能用別人的就用自己的 的原則,在網上找到乙個經典的使用css製作的二級選單,感覺不錯,先記錄下來,以備它用。經典的二級選單如下圖所示 其實,所謂的二級選單都差不多,無非就是為二級選單定義乙個層,當滑鼠放在一級選單上的時候顯示這個層,而將滑鼠從一...

二級選單級聯

好久沒總結了。先總結下這倆個月,看了點.net後台,看了點c 但不是很多,這倆天看了點php.總結總結下.net遇到的問題吧。第乙個其實就是乙個二級選單的級聯問題。用乙個簡單的例子說明一下。例子是乙個省份和城市的級聯,資料都從乙個資料庫的一張表裡取。前台 倆個dropdownlist控制項,這裡注意...