<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>三列布局</title><style type="text/css"> *{margin: 0;padding: 0;}html, body{height: 100%;}/*定位布局*/ .container, .left, .right, .center {height: 100%;}.container{position: relative;}.left, .right{top: 0;position: absolute;width: 200px;}.left{left: 0;background-color: #f60;}.right{right: 0;background-color: #e30;}.center{background-color: #fde560;padding: 10px 10px 0 10px;margin: 0 200px;}</style></head><body><div class="container"><div class="left"></div><div class="center">左右栏固定宽、中间栏宽度自适应</div><div class="right"></div></div></body></html>
html+css