关于响应式网页设计

手机网站+电脑网站+平板网站=响应式网站在没有足够的资金和精力建设手机网站的情况下，响应式网站是一个不错的选择。它有以下优点：减少工作量（只需要一份网站代码，只需要做js更改就可以）节省时间（考虑到每个设备，搜索也很友好）首先[][1]settings：大部分手机的浏览器核心都是基于webkit核心的，大部分浏览器都支持使用viewportmeta元素来覆盖默认的canvas缩放。所以我们可以在头部插入一个元来设置特定的宽度或缩放比例。width=device-width浏览器页面宽度为等于设备的宽度，user-scalable=no，静态缩放，如果是1.0：浏览器页面安装视口大小来渲染页面，maximum-scaleminimum-scalemaximum和minimum将页面缩放到几倍设备宽度。IE浏览器的一些设置，因为css3是响应式关键技术，但是IE浏览器的支持有限，所以呼吁的意思codeYes：告诉IE浏览器，IE8/9及以后的版本会用最高版本的IE渲染页面。有关详细信息，请参阅此博客。设置视口元标记后，页面将不会缩放。我们可以根据css3mediaquery修改不同viewport的宽度css3mediaquery@mediaonlyscreenand(max-width:30em){};@mediaonlyscreenand(max-width:50em){};@mediaonlyscreenand(min-width:30em)and(max-width:50em){};@mediaprint{}//打印样式最大宽度为50em写的样式。在30em//srcset用于指向提供的图片资源，sizes用于表示尺寸临界点，responsive响应式布局//IE不支持，但Edg兼容模式支持还有前面的js监听window.resize事件，还有svg，我对svg不熟悉，就不说了。在responsiveimage中，其实涉及到了物理像素，逻辑像素，dpi等等，但是我觉得新方案中不需要写1x2x，所以先写了，因为我只懂~我希望我下次能把它填满。如有错误欢迎指正~