本文主要是介绍2.1圣杯布局,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><!--1.两边固定,当中自适应2.当中列要完整显示3.当中列要优先加载--><style type="text/css">#middle{float: left;/*padding: 0 200px;*/width: 100%;height: 300px;background: red;}#left{position: relative;left: -200px;margin-left: -100%;float: left;width: 200px;height: 300px;background: yellow;}#right{position: relative;right: -200px;float: left;margin-left: -200px;width:200px;height: 300px;background: yellow;}#content{padding: 0 200px;}</style></head><body><div id="content"><div id="middle">丁香一样的芬芳</div><div id="left">丁香一样的颜色</div><div id="right">丁香一样的忧愁</div></div></body>
</html>
这篇关于2.1圣杯布局的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!