![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端学习之Web
文章平均质量分 72
crystal_iwwish
多读书 多看日出
展开
-
移动web-margin塌陷
margin塌陷有两种情况:(1)有两个盒子垂直排列,上面的盒子设置margin-bottom,下面的设置margin-top,那么他俩的间距会重叠,以大的计算(这种情况,只需要设置一个盒子的外边距即可)(2)父子元素中,内部的盒子给margin-top,那么父元素也会受到影响产生上边距解决办法(1)为父盒子设置border,添加border后,子元素和父元素就不是贴合的(可以将border设置为透明的 border: 1px solid transparent;)(2)为父盒子添加overf原创 2021-10-08 11:32:14 · 93 阅读 · 0 评论 -
移动web-双飞翼(圣杯)布局
两侧固定中间自适应的布局,称为双飞翼(圣杯)布局方法一:定位(1)父盒子设置左右padding值(2)给左右盒子的width设置父盒子的padding值,然后分别定位到padding处(3)中间盒子自适应<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="I原创 2021-10-08 10:57:48 · 124 阅读 · 0 评论 -
移动web-使一个盒子水平垂直居中的六种方法
方法一:利用定位(常用)<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />原创 2021-10-08 10:31:37 · 1447 阅读 · 0 评论