css p标签中如果设置了一个width，又设置了一个max-width,那样式会用那一个？

Posted 2023-05-05

这是两种样式，max-width的作用就是限制最大宽度，width大于max-width的话max-width就取代了width的值，width小鱼max-width的话，宽度就是width，max-width是限制作用。有一个应用就是一篇文章里有图片，但是需要图片的最大宽度不可以超出内容框的宽度，就可以给图片max-width为100%。就算你给图片width大于内容框宽度，但是由于max-width的存在，所以实际显示出的图片宽度还是100%，不会超出。更形象的比喻就是：妈妈有容忍程度max-width，小孩子淘气是width，你再怎么淘气值大于容忍程度的话，妈妈会打你把你的淘气值降低到可容忍的程度。追问

我在一个元素中设置width max-width。
既然我已设置了width，那么他怎么能超过这个width。
那么这个width还有什么意义？

追答

超过width时浏览器默认显示在“框外”，也就是“溢出”了，表现为“错位”
你表达的不清楚，我没太明白

参考技术A 都会用到，width相当于最小宽度，但是最大宽度不会超过你设置的max-width值，最小宽度不会小过你设置的width值 参考技术B 一看顺序，二看浏览器（ie6不支持max-width属性，只能width有效）
如果是支持max-width的浏览器：
如果width在前，则最小显示width的值，最大显示max-width的值
如果width在后，则只能显示width的固定值，相当于max-width无效 参考技术C 宽度分为width、min-width、max-width，一般情况下都会用到width，但是如果你有设置min-width和max-width，width超出max-width的之后，就会用到max-width，同理，width小于min-width的话就会用到min-width 参考技术D max-width较小时会用max-width,width较小时用width，但最大时为max-width

css已设置width100% 为啥宽度没有占满浏览器？

无论是水平线还是div等，设置了宽度100%，在浏览器里显示的效果里左右都留了一些空隙，任何浏览器都一样。该怎么办？

因为浏览器默认情况下会为元素添加margin和padding属性，需要将这两个属性初始化为0.

1、新建html文档，在body标签中添加一个div标签，然后为这个div设置一些样式：

2、用浏览器打开编辑好的html文档，这时可以从浏览器中发现浏览器四周留有一些白色空隙：

3、在style标签中为“*”添加“margin: 0;padding: 0;”样式，“*”表示所有元素，“margin”和“padding”表示外边距和内边距：

4、用浏览器重新打开编辑好的html文档，这时浏览器四周的白色空隙都会被去除：

参考技术A

css已设置width100% 宽度没有占满浏览器是设置错误造成的，解决方法为：

1、首先需要新建一个html文件，命名为test.html。

2、接下来在test.html文件内，使用div创建一个模块，下面将对该div进行样式设置。

3、然后在test.html文件内，给div添加一个class属性，主要用于在css标签中设置它的样式。

4、在css标签中，使用width属性设置div的宽度，设置width100%即可。

参考技术B 你是给什么元素设置宽度的看给块状元素设置宽度是可以的，但是内联元素设置宽度是没有效果的，比如a标签 这个我们在css里面设置宽度是没有效果的，要把a标签转换成块状元素，宽度的效果才可以实现，其次还有种可能，你写的可能是块状元素，但是没有设置边框，你看不见而已，但是宽度是发生变化的，具体内容你可以参考下php中文网上面的资料，希望对你有帮助！ 参考技术C 这个要看外侧的设置，一般情况下加上下面的即可
html,body
margin:0;padding:0;border:0


即可铺满宽度 参考技术D body有默认外边距，默认外边距是8px;
通过body margin:0; 清除默认外边距