[分享]css内控制div的宽度

CSS是我们在网页设计中最常用的控制样式的语言之一，其中控制div元素和内部宽度的方法也是一个必会技能。

div {
   width: 50%;
   height: 200px;
   border: 1px solid black;
   margin: 0 auto;
   padding: 20px;
} 

上述代码表示一个div元素的样式，其中width属性控制了div元素的宽度，可以用百分比或像素值进行设置。其余的属性都是用于美化该div元素的设置。

还有一点需要注意的是，如果该div元素内部还包含其他元素，如图片、文字等，那么他们对div元素的宽度也有影响。解决该问题的方法有两种：一种是给该div元素内部的元素设置宽度，另一种是使用CSS3的box-sizing属性，让元素的宽度包含了内边距和边框的值，具体方法如下：

div {
   box-sizing: border-box;
}

div img {
   max-width: 100%;
   height: auto;
} 

使用box-sizing: border-box;属性可以让元素的宽度包含了其内边距和边框的宽度，而img元素的max-width属性则可以让图片宽度最大只占据div元素内部的100%，避免溢出。

以上就是关于CSS内控制div元素的宽度的相关介绍，希望对您有所帮助。