当前位置:网站首页>使用float实现左中右布局,中间内容自适应
使用float实现左中右布局,中间内容自适应
2022-07-26 10:38:00 【songywaa】
使用float实现左中右布局,一定要注意中间div的位置问题
/*css*/
.left{
float:left;
width:200px;
}
.right{
float: right;
width:200px;
}
.center{
padding: 0 200px;/*使用margin也可以*/
}
<div class="box">
<div class="left">我是左边</div>
<div class="right">我是右边</div>
<div class="center">我是中间</div>
<!-- 在html中,中间自适应的div一定要放到最后边,因为左右div浮动不占高度,如果把中间div放到前边或者中间,就会把浮动元素挤到下边去 -->
</div>
边栏推荐
- .net operation redis string string
- hx711 数据波动大的问题
- 同步方法中不使用asyncTask<T> 修饰和await获取异步返回值(同步方法中调用异步方法)
- [leetcode daily question 2021/8/30]528. Choose randomly by weight [medium]
- 在神州IV开发板上成功移植STemWin V5.22
- STM32 Alibaba cloud mqtt esp8266 at command
- .NET操作Redis Hash对象
- Inheritance method of simplified constructor (II) - class inheritance in ES6
- 干货likeshop外卖点餐系统开源啦100%开源无加密
- Tradingview tutorial
猜你喜欢
2021-08-12函数递归_和鹏哥学习C语言
STM32 Alibaba cloud mqtt esp8266 at command
[leetcode每日一题2021/8/30]528. 按权重随机选择【中等】
Issue 8: cloud native -- how should college students learn in the workplace
SAP ABAP 守护进程的实现方式
Introduction to data analysis | kaggle Titanic mission (I) - > data loading and preliminary observation
干货likeshop外卖点餐系统开源啦100%开源无加密
RT-Thread 学习笔记(七)---开启基于SPI Flash的elmfat文件系统(中)
Tradingview tutorial
[leetcode每日一题2021/5/8]1723. 完成所有工作的最短时间
随机推荐
MySQL速学-2021-09-01
Oracle cannot start tnslistener service cannot start
The problem of large fluctuation of hx711 data
Simple use of json-c Library -- converting JSON files to struct
C语言计算日期间隔天数
剑指Offer(十):矩形覆盖
Redis docker instance and data structure
oracle 启动不了 tnslistener服务启动不了
鹏哥C语言第七节课总结
.NET操作Redis List列表
[leetcode每日一题2021/8/30]528. 按权重随机选择【中等】
2021-08-14三子棋
10 令 operator= 返回一个 reference to *this
[leetcode daily question 2021/5/8]1723. The shortest time to complete all work
Anaconda is used on vscode (the environment has been configured)
剑指Offer(四十九):把字符串转换成整数
第8期:云原生—— 大学生职场小白该如何学
SAP ABAP 守护进程的实现方式
[leetcode每日一题2021/2/14]765. 情侣牵手
Write to esp8266 burning brush firmware