[問題] 兩層navigation RWD做法

[azrael60532 (Kevin)]

各位前輩好
我剛接觸前端不久
最近遇到一個問題
想要在電腦版上顯示兩層Navigation
到手機版隱藏成抽屜的樣子
請問各位大大通常會怎麼寫呢?

示意圖:
http://i.imgur.com/StPPT9Z.jpg

如果不想寫兩個版本的nav 然後display:block/none
請問還有什麼做法?


或是有什麼關鍵字可以搜尋類似的範例做參考?

不好意思 問了這初階的問題 先謝謝大家了!!

--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 122.117.0.31
※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1494090866.A.EEA.html
推 jmlntw: flexbox，可以去參考各大 framework 是怎麼做的
不好意思 我找到的幾乎都是原本在電腦版就有下拉式選單的
像我示意圖那樣較客製的好像找不到
※ 編輯: azrael60532 (122.117.0.31), 05/07/2017 17:28:53
推 EPGo: 是這樣子嗎? https://jsfiddle.net/aLewsy09/
對!! 太強了~只是我想要子分頁不用hover就顯示
小弟不太會改SCSS :(
※ 編輯: azrael60532 (122.117.0.31), 05/07/2017 21:41:41
→ EPGo: https://jsfiddle.net/aLewsy09/1/ 是這樣嗎? 順便調整為CSS
→ EPGo: 我的做法是：電腦版li inline-block 手機版變為block
感謝!!幫大忙了 這樣我就會修改了
※ 編輯: azrael60532 (122.117.0.31), 05/08/2017 21:12:16