101css是一个优秀的CSS网站,其网址为www.101css.com。在这个网站上,你可以学习到各种CSS布局的技巧和方法。
其中,200布局和80布局是比较经典的两个CSS布局,下面我们来详细了解一下:
.layout-200 { width: 100%; display: flex; } .layout-200 .left { width: 200px; } .layout-200 .right { flex: 1; }
200布局是基于Flexbox实现的,可以让左边的栏目宽度为200px,右边的栏目自适应剩余宽度。这种布局适合用于左边是导航栏目,右边是内容的网站页面。
.layout-80 { width: 100%; overflow: hidden; } .layout-80 .left { float: left; width: 80px; margin-right: 20px; } .layout-80 .right { overflow: hidden; }
80布局是基于浮动实现的,可以让左边的栏目宽度为80px,右边的栏目自适应剩余宽度。这种布局适合用于左边是图标或者小工具,右边是主要内容的网站页面。
总的来说,101css是一个非常实用的网站,让CSS初学者和专业人士都可以从中受益。
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://haodehen.cn/did245498