CSS自适应窗口大小的容器效果

发布时间：2018-09-15 12:06:07 所属栏目：专访来源：站长网

导读：CSS自适应窗口大小的容器居中，在内层的容器中，你可以输入一些文字，内层窗口会随着窗口的大小而自动适应，而且它始终是水平和垂直居中的，实用性大大增强，对此感兴趣的朋友好好参考一下哦。代码演示： htmlheadstyle type=text/css*{margin:0; padding

　　CSS自适应窗口大小的容器居中，在内层的容器中，你可以输入一些文字，内层窗口会随着窗口的大小而自动适应，而且它始终是水平和垂直居中的，实用性大大增强，对此感兴趣的朋友好好参考一下哦。

　　代码演示：

<html> <head> <style type="text/css"> *{margin:0; padding:0;} html,body{width:100%; height:100%;overflow:hidden;} body{margin:100px 0 0 100px;position:relative;} .wrap{height:100%; width:100%; background:#ccc; position:absolute; bottom:200px; right:200px;} .cont{margin:200px 0 0 200px;} </style> </head> <body> <div class="wrap"><div class="cont">烈火学院（www.LieHuo.net）以提供计算机知识、网站运营、软件应用、设计教程、编程开发与IT资讯等为主要宗旨，同时有源码下载、站长工具、在线手册、免费资源等内容，是国内快捷易懂、内容丰富的网上学习网站。 </div></div> </body> </html><br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：鞍山站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!