面试遇到的坑CSS篇 1
------------恢复内容开始------------
1.display: none和 visibility: hidden
代码
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#box{
background-color: #ffbbff;
height: 300px;
width: 600px;
text-align: center;
font-size:0;
margin: auto;
width: 100%;
}
div {
background-color:#ddffbb;
height: 140px;
width: 140px;
display: inline-block;
font-size:14px;
}
.div2{
display: none;
}
.div3{
visibility: hidden;
}
</style>
<div id="box">
<div class="div1">1</div>
<div class="div2">2</div>
<div class="div3">3</div>
<div class="div4">4</div>
</div>
效果
div3使用 visibility: hidden; 可以看到在第三个盒子中还是会占用空间而 div2 使用display: none;后完全消失在网页中
2.如何让三个div盒子居中在页面中显示
使用display：inline-block; 后盒子就是变成一排并且盒子之间有间隙，
使用 float:left;可消除缝隙
或者父元素添加font-size:0;此时子元素再设置font-size: 14px
待补充
------------恢复内容结束------------
最新文章
- 自定义从Azure下载回来的远程桌面连接（.rdp）文件，使其提供更多丰富功能
- 第二次团队作业 －－ 预则立&&他山之石
- 在Ubuntu16.04集群上手工部署Kubernetes(未完，陆续补充中)
- 判断IP地址的类型
- java取整和java四舍五入方法 转自董俊杰
- Enum类型 枚举内部值/名
- 《C和指针》读书笔记 第5章-操作符和表达式
- POJ3258River Hopscotch（二分）
- 首次登录与在线求助man page
- springboot命令启动
- springboot~application.properties和application.yml的使用
- Android创建或删除了文件，在电脑端查看的时候，却没有对应的变化，处理办法
- spark-MLlib之线性回归
- hadoop常见问题
- 【PHPStorm使用手册】如何设置字体大小？
- unity 安装破解提示partern not found和tutorials学习
- HDU 6047 17多校 Maximum Sequence（优先队列）
- ETL化的IOTA架构
- How To: Implement a Major Upgrade In Your Installer
- Spark2 文件处理和jar包执行