CSS属性中的width:auto;或不设跟width:100%;的区别

 

width: auto或不设置宽度

  • 子元素(包括content+padding+border+margin)撑满整个父元素的content区域。
  • 子元素有margin、border、padding时,会减去子元素content区域相对应的width值
  • 父元素的content = 子元素(content + padding + border + margin )

width: 100%

  • 强制将子元素的content区域 撑满 父元素的content区域
  • 子元素有margin、border、padding时,不改变子元素content区域的width,而是溢出父盒子,保持原有值
  • 父元素的content = 子元素的content

简单来说,就是子元素width:auto;时父元素的content=子元素的content+margin,border之类的,即设置margin之类属性有效,而设置width:100%;则会强制性的撑满父元素的空间。

没有更多推荐了,返回首页