正在仿做网页，遇到了如何让页面适应不同屏幕大小的问题。
我看了看现在网上的网页，布局全部都是用html和css做的。
js禁止后页面完全不受影响（我尝试过）。
请问这是怎么做到的？
而我在平常练习时设置页面宽度用的都是绝对宽度、或者通过js获取屏幕宽，度然后应用在最外层容器元素上。
绝对宽度还好些（例如1600px），我不会考虑那么多，里面的子元素也全部是用px这种定位布局。
而js获取，然后应用在最外层容器元素则令我感到很麻烦，因为设置的时候不知道宽度具体多少，所以在子元素里面用的是百分比。
可这两种方法，第一个根本无法适应不同屏幕大小的设备，第二个若是禁止js脚本的话，就废了。
所以，怎样利用纯html+css做出自适应
不同屏幕大小的网页？？
希望给出具体思路，而不是太概括的：例如，响应式布局等……
@media
在css里面能获取屏幕宽度等信息
如果是在学习过程中，那你可以试试用bootstrap的框架，在使用过程中结合看源码，自己摸索人家怎么实现，为什么这么实现。这东西不是简单几句话能说清楚的，还是需要自己花功夫
响应式布局 或者在定义高宽时使用百分比
Bootstrap 响应式布局
这个早已经有成熟的方案了，用rem布局和用百分比布局。
上代码
<script>
var docEl = document.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
var clientWidth = docEl.clientWidth;
docEl.style.fontSize = 10 * (clientWidth / 320) + 'px';
window.addEventListener(resizeEvt, function() { clientWidth = docEl.clientWidth;docEl.style.fontSize = 10 * (clientWidth / 320) + 'px'; }, false);
</script>bootstrap 栅格系统
bootstrap grid
用媒体媒介和百分比就可以实现，目前也有比较多的响应式框架，如UIKIT和国内的拼图
简单的来说，就是div盒子的宽度不用像素来限定，比如 1200px 960px 这些，用百分比，比如 100% ，这样。
你可以尝试了解一下bootstrap前端框架。
http://www.bootcss.com/
如果想走捷径，可以用HTML5前端框架来实现，推荐你下国人的前端框架Aamze UI
在移动端有很多的开发框架，如果你不仅要考虑PC还要在各种各样的移动设备上完美显示那就要考虑使用响应式
移动端可以考虑rem布局 个人感觉很不错 不过里面一般会有一段js代码来动态修改html的font-size的（个人感觉这个不错 其余的有些事根据媒体查询直接修改html的font-size 这个也可以用）
PC端 那就响应式布局了 上手bootstrap 挺简单的 用它的珊栏结构 做些不是很复杂的页面 都是可以的
如果是针对适应不同的手机屏幕的话，可以用rem来做，如果要是适用不同的电脑屏幕的话，可以用框架，Github上最火的框架莫过如bootstrap了。
用百分比来规定页面宽度
结论就是响应式布局啊，你搜一搜就能查到很多相关文章。
如果你是问原理的话，就是用css媒体查询针对不同的屏幕尺寸区间设定不同的规则。比如大屏幕上就展示更多的元素，或将元素横向排列等等；小屏幕上就隐藏一些元素，或将元素改成纵向排列等等。
你可能还想了解如何自适应，其实则是利用css相关属性，比如弹性盒布局，百分比、rem、vw等单位。总之不是一两句话能说清楚的，你还是得去找相关文章来看，不要想走捷径，这些都是要自己一点一点学的。
手机上，就不说太多了。
这个叫响应式布局
贴上自家网站响应式布局教程：http://www.jikexueyuan.com/course/243.html；
还有简单常用的Bootstrap响应式布局，具体文档可以上Bootstrap中文网看下文档http://www.bootcss.com/
将所有style都写入css文件中，然后批量替换，比如屏幕大小是1280*800,一个图片宽度是200，那么就替换成200/1280x100 %