How to make the web site design more flexible

一笑奈何 提交于 2019-12-21 21:57:02

问题


I wanna to ask the following question about the design of any web application.

When maximizing ,, minimizing , zooming the browser ,, i note many problems happen to my web application design for example the horizontal menu like the one exists in SO site when minimizing the window the items of the menu in my website go down the other .. and other things make the site sucks and distracts the design .. how to make the design more flexible with the changes in monitor size , the preferences of the browser , maximizing ,and minimizing the browser ,, how to make the site design more flexible about all those issues .

Please any instructions , advice should i take care to reduce these errors.


回答1:


  • Use percentage based widths for dimensions of your page and elements rather than pixels
  • Use em for your font sizes rather than px or pt
  • Try not to use images for navigation or if you do, make them expandable using the sliding doors method - http://www.alistapart.com/articles/slidingdoors/
  • Read up on liquid layouts - http://www.maxdesign.com.au/articles/liquid/ http://www.alistapart.com/articles/negativemargins/



回答2:


A site that makes heavy use of float: and no width: values in its CSS will run into problems when people get crazy with the window sizes.

You can either nail everything in place by specifying width: px; all over your CSS, or you can go liquid and use width: %; for your objects. The former is considerably easier to pull off than the latter.




回答3:


Try use something like Less Framework( http://lessframework.com/ )

Make sure you resize your browser when you visit the site!



来源:https://stackoverflow.com/questions/4733199/how-to-make-the-web-site-design-more-flexible

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!