css Layout(网页布局)
CSS布局易于设计。我们可以使用CSS布局来设计我们的网页,例如主页,与我们联系,关于我们等。
有三种设计网页布局的方法:HTML Div+CSS布局:现在已广泛使用。
HTML表格:速度较慢,较不受欢迎。
HTML框架集:现已弃用。
CSS布局可以包含页眉,页脚,左窗格,右窗格和正文部分。让我们看一个简单的CSS布局示例。
CSS布局示例
示例html>
.header{margin:-8px -8px 0px;background-image:linear-gradient(145deg,#7379ff,#b524ef);color:white;text-align:center;padding:10px;}
.container{width:100%}
.left{width:15%;float:left;}
.body{width:65%;float:left;background-color:pink;padding:5px;}
.right{width:15%;float:left;}
.footer{margin:-8px;clear:both;background-image:linear-gradient(145deg,#7379ff,#b524ef);color:white;text-align:center;padding:10px;}
基础教程 nhooo.com
左边栏
正文
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
右边栏
Footer
测试看看‹/›
输出效果:
基础教程 nhooo.com
左边栏
正文
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
页面内容在这里
右边栏
底部