这些天制作网站时,@ media应该在CSS中做多少？
我认为一个用于iOS,一个用于大型手机(三星),一个用于小型平板电脑,一个用于普通平板电脑,一个用于笔记本电脑/台式机.
那有点矫枉过正吗？
我也可以通过使用最小宽度来减少所有这些东西来减少写东西吗？
是的,你可以使用公正min-width或max-width媒体查询 - 这是很常见的做法.
这是一个基于意见的问题,因此并不完全在Stack Overflow的范围内,但无论如何我都会咬人.
媒体查询越少,IMO越好 - 您的设计越流畅/自然响应越少,您就越不必担心处理大量的媒体查询.我构建的大多数网站只有一个媒体查询,主要介于移动和平板/桌面分辨率之间:@media only screen and (max-width: 767px) { }所以断点是768.
如果您认为限制性太强,可以在1024左右添加一个用于桌面分辨率,因此您可以使用移动设备/平板电脑/台式机,而不仅仅是移动设备和平板电脑/台式机.一般来说,如果您使用的是流体布局技术,那么您应该已经开始设计网站,这样您就可以通过一个断点来逃避Z Zurb Foundation.
这鼓励了响应式设计的最佳实践,更易于维护并让您摆脱追逐每个新设备分辨率的竞争对手 - 有太多的设备可以针对特定的屏幕尺寸进行优化,因此最好设计一个可以工作的网站在所有这些上,而不是为每个可以想象的显示器提供1亿个媒体查询.