[讨论] 关于相同代码在同一页面出现两三次...

楼主: mauve (mauve是淡紫色)   2018-09-22 21:30:55
最近在写一个可以放自己写的程式的网站
而且是基于WordPress的
不过因为是第一次接触RWD网页设计
因此花了好一大把时间进度却很慢
其中在做手机端与电脑端Navigation Bar的适配时
发现当为了达到某些功能
有些代码需要重复写进去同一个页面才能达到
像是一个选单在不同装置想呈现不同效果
我就在同一个页面加入了3次取得选单html的php代码
这是我网页上呈现Navigation Bar的三种形式:
Desktop-Original:
http://i.imgur.com/sxQmLh8.jpg
Scroll to Fixed:
http://i.imgur.com/SDw7orw.jpg
Mobile:
http://i.imgur.com/PJAspq6.jpg
最后附上因为走投无路而勉强写进的三个相同的代码:
http://i.imgur.com/XHjoIb6.jpg
想请问一下各位高手
做成这样还算是一个好的rwd网页吗?
还是这一切都是因为自己经验不足或是太笨?
楼主: mauve (mauve是淡紫色)   2018-09-22 21:55:00
作者: torali (pandaemon)   2018-09-22 22:48:00
看起来写一个就够,如果是我会用position和flex排版,然后在media query去操作这两个属性变成你要的样子
作者: jhnny97 (≡(  ゚Д゚))   2018-09-23 08:22:00
在最顶端放一个空的元素卡位scroll就顺了(?
作者: ymcheung (ymc)   2018-09-23 09:26:00
确实也是有 flexbox order 搞不定的时候如果网站规模很大,我会请后端帮忙判断 device 各自出
作者: jherk   2018-09-23 13:18:00
用js操作class, class写css media控制rwd显示/隐藏
作者: yzfr6 (扮关二哥!)   2018-09-24 16:09:00
程式码
作者: jake255121 (微花猴杰)   2018-09-25 15:30:00
我只好奇你的文章怎么会这么异国风情

Links booklink

Contact Us: admin [ a t ] ucptt.com