css高度已知,左右定宽,中间自适应三栏布局
生活随笔
收集整理的這篇文章主要介紹了
css高度已知,左右定宽,中间自适应三栏布局
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
css高度已知,左右定寬,中間自適應三欄布局:
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><style>*{margin: 0;padding: 0;}.box>div{height: 100px;}.box .left{background-color: red;width: 300px;float: left;}.box .right{background-color: blue;width: 300px;float: right;}.box .center{text-align: center;line-height: 100px;color: #fff;background-color: orange;}</style> </head> <body><div class="box"><div class="left"></div><div class="right"></div><div class="center">第一種方法:浮動</div></div></body> </html>
總結
以上是生活随笔為你收集整理的css高度已知,左右定宽,中间自适应三栏布局的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 两天学会css基础(一)
- 下一篇: 去除inline-block间隙的几种方