day6 july21

83 阅读1分钟

p51 外边距的重叠

  • 垂直方向的相邻外边距会取两者中的较大值
    1. 一正一负取相加值
    2. 两负取绝对值较大的
  • 父子元素的相邻外边距,子元素的会传递给父元素(上外边距)

p52 行内元素的盒模型

  • 行内元素不支持设置宽高
  • 可以设置内外边距和边框,但在垂直方向不影响布局
  • inline-block既可以设置宽高又不会独占一行
  • display:none
  • visibility:hidden

p53 重制样式表

  • reset.css 去除了浏览器的默认样式
  • normalize.css 对默认样式进行了统一

p56 京东左侧导航栏

  • 鼠标hover时li的背景色改变

p58 box-sizing

  • 盒子尺寸的计算方式,由box-sizing属性决定,属性值有以下
    1. content-box:默认值
    2. border-box:width和height指内容区,内边距,边框的总大小

p59 轮廓阴影和圆角

  • outline:轮廓线,不会影响页面布局
  • box-shadow:水平偏移量,垂直偏移量,阴影模糊半径,阴影颜色
  • border-radius:一个两个三个或四个值
  • border-top-left-radius:水平方向/垂直方向
  • border-top-right-radius
  • border-bottom-left-radius
  • border-bottom-right-radius