前端面试-width:100%和width:auto的区别

202 阅读1分钟

width:100%和width:auto的区别

假设父元素盒子的宽度为300px:

  • width:100%表示子元素的宽度(内容的宽度)和父元素的宽度相等,但是不包括子元素内外边距及边框的值,width为100%的子元素如下图所示

捕获.PNG

  • width:auto表示子元素的宽度+内外边距+边框等于父元素的宽度,width为auto的子元素如下图所示,此时子元素内容宽度为300-(10+5+10)✖2=250

捕获1.PNG