css实现三栏网页布局的五种方式
开门见山，以下内容主要以较为常见的三栏布局（左右固定宽度，中间宽度自适应）作为模版来跟大家分享。本文分享五种较为常用的布局方式，如果有其他方式方法的欢迎评论区交流。作为一年开发的前端小白，还请各位技术大佬发现问题请指正，欢迎交流，勿骂😂。 浮动布局、绝对定位布局、flexbox布局、表格布局、网格布局； 1、浮动布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>三栏布局</title> <style> html * { margin: 0; padding: 0; } .box div { min-height: 100px; } .box .left { float: left; width: 300px; background: red; } .box .right { float: right; width: 300px; background: blue; } .box .center { background: green; } </style> </head> <body> <div class="box"> <div class="left"><p>left</p></div> <div class="right"><p>right</p></div> <div