css 最大宽度 css max-width

2024-01-18 11:32 小编

最大宽度为变量宽度,含意对对象配置最大宽度后,其对象宽度将不逾越此最大宽度值。从字也能明白最大即是不逾越之感化。max-width也属于width宽度一种细分。与之对应为最小宽度 min-width!

max-width
css 最大宽度 属性款式

一、最大宽度语法

max-width语法:
max-width : 200px
设置对象最大宽度200px

max-width:60%
设置对象相等于父级宽度最大宽度为父级宽度60%。假如父级宽度为200px,那末此对象设置装备摆设max-width最大宽度为60%,那末理论最大宽度等于200×60%=120px

特别当心:一般设置变量的宽度,固定宽度(width)就不克不及同时配置。

最大宽度 css max-width值阐明:值兴许为具体数值譬喻(100px、500px);大概为百分比值比如(70%、90%),但值不能为负数(只能为正值)。

二、最大宽度语法布局分析图

最大宽度 max-width属性语法分析结构图
最大宽度 max-width属性语法剖析构造图

三、max-width最大宽度DIV CSS实例

1、div css对付最大宽度实例描画
这里配置一个300px宽、边框1px红色的盒子,再配置一个百分比div盒子。这里设置css边框也是为了便于观测对象宽度状况。

2、最大宽度运用实例css代码

.warp{ max-width:300px; border:1px solid #F00}
.bfb{ max-width:30%; border:1px solid #00F}

3、实例对应html模式代码

<div class="warp">
直接放内容,看看我这个DIV宽度,
接下来缩小涉猎器宽度小于300px尝尝,
看看宽度是否会变小
</div>

<div class="bfb"> 为最大宽度设置装备摆设30%,同样观察宽度状况,并在缩小浏览器宽度看看变卦情况 </div>


在线咨询 拨打电话

电话

13363039260

内部绝密传真282期

微信二维码