自己制作的网页怎么自适应手机端
说说我知道的方法。
其实这个需求应该是实现一侧固定宽度，另一侧自适应宽度，传统的圣杯布局，可以解决这个问题，然而这会导致嵌套太多层。
现在我们团队采用的是使用REM进行适配，适配原理：
introduction-for-lnv-mobile-base/针对移动端的前端工作流(2)-使用rem做移动端适配.md at master · mqyqingfeng/introduction-for-lnv-mobile-base · GitHub
当采用REM进行适配，在开发的时候，测量多少就会写多少px，就不用再考虑自适应的问题。文档怎么自适应页面
1一般情况下，word页面为A4页面大小，除去上下左右的页边距，图片的高度在24-25厘米左右，宽度在14-16厘米左右。因此需要提前把图片大小设置在这个范围内。
2先打开一个空白的excel，选择工具栏中的【插入】-【图片】，在电脑中找到图片，批量插入多张图片。
3插入的图片默认被全部选定，这时候不要点击excel工作表中的任何位置，直接进入【图片工具】-【格式】，在下方中点击【大小】右侧的小图标。
4在大小和属性设置框中，将【锁定纵横比】和【相对于图片原始尺寸】去掉，然后将高度设为24.5厘米，宽度设为14.6厘米。
5然后将excel表格【另存为】，选择【其他格式】，对文件命名，保存类型选择【网页】。保存的文件中会单独生成一个文件夹，里面有插入excel的图片。
响应式和自适应有什么区别
自适应：
在不同分辨率下不同设备上显示相同的页面。即：根据屏幕的宽度，自动调节网页内容的大小，使其主体内容和布局不变。
响应式：
响应式的概念应该是覆盖了自适应，但是包括的东西更多了。响应式布局可以根据屏幕的大小自动的调整页面的展现方式，以及布局。
(1)允许网页的宽度自动的调整
(2)尽量少使用绝对的宽度，多点百分比
(3)相对大小的字体:字体不要使用px写死，最好使用相对大小的em，或者高清方案rem，这个不限制与字体，别的属性也可以这么设置
(4)流式布局，float等float的好处是，如果宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向overflow（溢出），避免了水平滚动条的出现。
(5)选择加载css，<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 400px)" href="tinyScreen.css" />，这个意思是如果屏幕宽度小于400像素（max-device-width: 400px），就加载tinyScreen.css文件。
响应式和自适应的区别：
1、响应式设计简而言之就是一个网站能够兼容多个终端，而不是为每个终端做一个特定的版本。在这里大家可以理解为做一个网站就能适应多种设备，而不用在为每个设备做一个特定的版本，在不同的设备上展现的模式也不一样。响应式可以为不同终端的用户提供更舒适的界面和更好的浏览体验。
2、 自适应设计指能使网页自适应显示在不同大小终端设备上新网页设计方式及技术。大家可以理解为不同大小的设备上呈现同样的页面，让同一个页面适应不同大小屏幕，根据屏幕的大小，自动调整布局。
3、总体来说，响应式设计比自适应设计在功能、体验式更加全面。响应式网站可以用建站宝盒搭建。
到此，以上就是小编对于为什么网页要自适应屏幕的问题就介绍到这了，希望介绍的3点解答对大家有用，有任何问题和不懂的，欢迎各位老师在评论区讨论，给我留言。
微信扫一扫打赏
