CSS中如何处理不同的屏幕分辨率?
我是 UI 设计新手 - 想知道在定位各种 HTML 元素时处理不同屏幕分辨率的最佳方法是什么? 我认为使用 %ages 会是前进的方向,但事实证明并非如此!
I am new to UI design- was wondering what the best way to deal with different screen resolutions is when positioning various HTML elements?
I thought using %ages would be the way forward but turns out it isn't!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
首先看看这是否适合你。
用此替换您的标签
现在如果是,则实现此 onload。这将减少 100% 的麻烦,并且可以快速破解具有 1366 x 768 屏幕的笔记本电脑,而不会损坏更新、更大和更好的屏幕的外观和感觉
First see if this works for you.
replace your tag with this
Now if does, than implement this onload. This will reduce 100% of your headaches and will do a quick hack for laptops with 1366 x 768 screens without damaging the look and feel for newer, bigger and better screens
您应该看看液体布局。这涉及根据用户浏览器大小扩展或收缩网页 -
http://www. maxdesign.com.au/articles/liquid/
http://www.alistapart.com/文章/负利润/
You should take a look at liquid layouts. This deals with an expanding or contracting web page based on a users browser size -
http://www.maxdesign.com.au/articles/liquid/
http://www.alistapart.com/articles/negativemargins/
% 是正确的方法。如果你开始使用 Javascript 来检测分辨率并根据该分辨率调整设计,你的代码将很快变成美味的肉意大利面。
过去,我总是被告知要以 800x600 的最低分辨率进行设计,但现在我总是以 1024x768 作为最低分辨率。
如果没有更多有关设计的细节,恐怕我们无法提供更多帮助!
% is the correct way. If you start using Javascript to detect resolution and adjust design based on that your code is going to turn into tasty meat spaghetti very quickly.
Back in the day I was always told to design with a minimum resolution of 800x600, but nowadays I always go by 1024x768 as a minimum resolution.
Without more specifics about designs, we can't really help more I'm afraid!
检查 960grid,它是一个布局标准,可以被最常见的屏幕分辨率整除。
check 960grid it's a layout standard that's divisible by the most common screen resolutions.
请阅读此处:http://www.smashingmagazine.com/2011/ 01/12/guidelines-for-responsive-web-design/
您对
@media
查询最感兴趣,特别是max-width
和最小设备宽度
Have a read here: http://www.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/
You'd be most interested in
@media
queries, particularlymax-width
andmin-device-width