2020.8.17付海政

今天主要讲的内容是页面布局,首先讲的是关于定位的内容,其中比较重要的是float布局,但是float布局会引外边距溢出等问题,一下是解决方法

1.给父元素设置高度,缺点:不是每次都可以知道具体高度;

2.给父元素设置浮动,缺点,会影响父元素后续元素

3.为父元素设置overflow:hiddenn; 缺点,如果有内容要溢出显示也会被一同隐藏

4.为父元素设置display:table; 缺点,盒模型属性改变,会造成其他问题

5.在父元素中追加一个空元素,设置clear:both;

6.用伪元素,然后设置clear:both;

简单讲了css常用属性之后,就进入到了弹性布局

使用display:flex;是容器变为弹性容器,比较常用的属性如下

flex-direction:设置主轴方向

flex-wrap:设置项目换行

flex-flow:设置主轴方向,设置项目换行

justify-content:设置项目在主轴上的对齐方式

标签


Warning: A non-numeric value encountered in /www/wwwroot/www.ycdledu.com/wp-content/themes/storeys-pro/common/_wbt_core.php on line 495

Warning: A non-numeric value encountered in /www/wwwroot/www.ycdledu.com/wp-content/themes/storeys-pro/common/_wbt_core.php on line 495

Warning: Division by zero in /www/wwwroot/www.ycdledu.com/wp-content/themes/storeys-pro/common/_wbt_core.php on line 495

评论


© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1