菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 王嘉乐-2022-10-15 前端css [打印本页]

作者: yousay！ 时间: 2022-10-15 00:28
标题: 王嘉乐-2022-10-15 前端css
一、今日学习内容1.CSS的盒子模型
边框（border）border： border-width border-style border-color;
标格的细线边框（border-collapse）属性值为：collapse 合并/塌陷边框重叠。
外边距（margin）
         外边距可以让块级盒子水平居中条件：1、盒子必须指定宽度2、盒子左右的外边距设置为auto即可
            如果是行内元素或者行内块元素设置水平居中，使用text-algin：center；来实现即可（给父元素添加该属性）。
   外边距合并的问题相邻块元素垂直外边距的合并问题取两个值中的较大者
   嵌套块元素的垂直外边距塌陷
         如果父元素和子元素同时都有上外边距，此时父元素会塌陷较大的外边距值。
            解决办法：1、给父元素添加上边框 2.给父元素添加上内边距
                              3、给父元素添加overflow：hidden；
         清除内外边距：网页中的各个元素基本上都有自己所自带的内外边距，
                     使用通配符选择器进行清除后，方便后期的样式调整。
2.CSS的圆角边框
      语法：border-radius:length（像素值）;
               属性值可以为具体的数值或者百分比，border-radius指的是圆的半径
3.CSS的盒子阴影
属性名为 box-shadow
         1、阴影默认的就是外阴影（outset），但是这个属性值写在box-shadow属性内，否则阴影无效2、盒子阴影不会占用空间，也就是不会影响盒子的排列
二、今日遇到问题
1.不知道一个标签比如div盒子  是一个大盒子里面的小盒子还是就是一个小盒子
三、解决方法
1.未解决自己理解为一个大盒子外边有边框外边距里面有外边距。

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)