|
今日学习内容： 1.CSS的盒子阴影 CSS中使用box-shadow属性 属性值： h-shadow 必须值 水平阴影位置 v-shadow 必须值 垂直阴影位置 blur 可选 模糊距离 spread 可选 阴影尺寸 color 可选 阴影颜色 inset 可选 将外部阴影改为内部阴影 默认值是outset 但是outset不能写在box-shadow中，否则阴影失效。 注意：盒子阴影不会占用空间， 不会影响其他盒子的排列 2.CSS的浮动 CSS的传统布局方式 普通流（标准流） 比如说块级盒子自己占一行，行内元素一行会显示多个，标准流就是最基本的布局方式。 浮动 定位 浮动 为什么需要浮动？ 可以让多个盒子水平排列成一行，而且中间没有空白间隙 浮动的属性 float 属性值 none 元素没有浮动（默认值） left 左浮动 right 右浮动 注意点 在网页布局时，纵向找标准流，横向找浮动。 浮动的特性 浮动的元素会脱离标准流（脱标） 浮动的元素一行内显示并且沿元素顶部对齐 浮动的元素会行内块元素的特定 浮动的盒子会压住后面的标准流盒子，但是不会压住文字（原因是：浮动的技术研发之初就是为了实现文字环绕的） 浮动的盒子只会影响它后面的标准流，不会影响前面的标准流。 浮动的注意点 1、浮动的盒子和标准流盒子搭配的方法 父级盒子用标准流进行上下排列，子盒子采用浮动来进行横向排列 2、一个元素浮动了，理论上其余的兄弟元素也都需要浮动 因为浮动的盒子会脱标， 如果兄弟盒子只浮动了一个，那么会影响后面的其他兄弟盒子。清除浮动 1、额外标签法 额外标签法也称为隔墙法，是W3C推荐的做法。 在浮动元素的末尾添加一个空标签，这个空标签要求必须是块级元素。2、给父级添加overflow:hidden属性 3、给父级添加after伪元素 4、给父级添加双伪元素 今日遇到问题 1、下午在做小米商城的练习时遇到问题较多，不知道如何下手，不了解浮动这个功能，最后在老师的讲解下理解了不少。 2、在做小米商城的案例时，遇到问题较多，通过看老师上课的代码和笔记解决了一部分。 | 
