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%；则会强制性的撑满父元素的空间。