[html] 写一个左中右的满屏布局,左右固定220px,中间自适应并且要优先加载
生活随笔
收集整理的這篇文章主要介紹了
[html] 写一个左中右的满屏布局,左右固定220px,中间自适应并且要优先加载
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
[html] 寫一個左中右的滿屏布局,左右固定220px,中間自適應并且要優先加載
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>test transform</title><style>* {padding: 0;margin: 0;}.main {position: relative;}.center {position: absolute;box-sizing: border-box;width: 100%;padding: 0 220px;overflow: hidden;}.inner {height: 100px;background-color: silver;}.fl {float: left;}.fr {float: right;}.fl,.fr {width: 220px;height: 100px;}.left {background-color: red;}.right {background-color: black;}.clearfix::after {display: block;content: '';clear: both;height: 0;visibility: hidden;}</style> </head> <body><div class="main clearfix"><div class="center"><div class="inner">測試測試測試測試測試測試測試測試測試測試測試</div></div><div class="left fl"></div><div class="right fr"></div></div> </body> </html>個人簡介
我是歌謠,歡迎和大家一起交流前后端知識。放棄很容易,
但堅持一定很酷。歡迎大家一起討論
主目錄
與歌謠一起通關前端面試題
總結
以上是生活随笔為你收集整理的[html] 写一个左中右的满屏布局,左右固定220px,中间自适应并且要优先加载的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 前端学习(3047):vue+eleme
- 下一篇: 平面设计师和ui设计师_平面设计师为什么