css min-width与max-width的使用

一、最大宽度属性max-width


1、在CSS中,最大宽度属性(max-width)用来定义宽度显示的最大值,当拖动浏览器边框使其显示范围大于最大宽度的时候,元素显示最大宽度值定义的宽度。

2、在最大宽度属性值中,可以使用三种属性值,分别为auto值、长度值和百分比值,其语法结构如下所示

max-width: auto |  length  | percent;

注意:在IE6.0中,会忽略这个属性,将宽度使用默认值100%显示

二、最小宽度属性min-width


1、在CSS中,最小宽度属性(min-width)用来定义宽度显示的最小值,当拖动浏览器边框使其显示范围小于最小宽度的时候,元素显示最小宽度值定义的宽度。

2、在最小宽度属性中,可以使用三种属性值,分别为auto值、长度值和百分比值,其语法结构如下:

min-width: aotu | length | percent;

注意:在IE6.0中,会忽略这个属性,将宽度使用默认值100%显示

参考资料:  css min-width与max-width   http://www.studyofnet.com/news/881.html

时间: 2024-10-22 22:48:43

css min-width与max-width的使用的相关文章

CSS的width:100%和width:auto区别

CSS的width:100%和width:auto区别 一.   问题 前段时间在调整树结构的时候,发现如果树的节点名称比较长的话在IE6下则不会撑开外面的元素,导致节点的名称只显示了一半,同时图标和名称换行显示了,但是在IE8和IE9下则显示正常.定位到问题后,最终发现是下面的属性导致的,如下图红色所致,把width的值设置为auto后即可解决问题: .TreeView,.TreeView ul{ padding:0px 0px 0px  19px; list-style:none; marg

css中width:auto和width:100%的区别是什么

width的值一般是这样设置的: 1,width:50px://宽度设为50px 2,width:50%://宽度设为父类宽度的50% 3,还有一个值是auto(默认值),宽度是自动的,随着内容的增加而增加,随着浏览器的宽度而换行 width:auto和width:100%的区别: 一.width:auto 1.块级元素默认的宽度值,意味着浏览器会自己选择一个合适的宽度值. 2.内容的宽度='margin-left' + 'border-left-width' + 'padding-left'

width:auto; 和 width:100%;的不同

width:auto:会将元素撑开至整个父元素width,但是会减去子节点自己的margin,padding或者border的大小.width:100%:会强制将元素变成和父元素一样的宽,并且添加额外的空间到这个元素的width上.就是因为这个,会导致很多问题. 使用width:100%永远都不是一个好主意.这个属性容易让人产生你正在定义一个元素可视大小,其实,你是在对这个元素的状态做了巨大的改变. 块元素会填满其父元素的整个width,因为块元素默认的是width:auto;的. See th

arg min,arg max, e.g ,i.e

数学中常见的arg min,arg max 是什么意思 arg 是变元(即自变量argument)的英文缩写 arg min 就是使后面这个式子到达最小值时的变量的取值 arg max 就是使后面这个式子到达最大值时的变量的取值 例如 函数F(x,y): arg min F(x,y)就是指当F(x,y)取得最小值时,变量x,y的取值 arg max F(x,y)就是指当F(x,y)取得最大小值时,变量x,y的取值 在论文中s.t.i.e.w.r.t代表的意思: s.t.是subject to (

fatal error C1189: #error: "Oops: min() and/or max() are defined as preprocessor macros. Define NOMINMAX macro before including any system headers!"

1.问题描述 vs2015 使用pg数据库的C++库文件4.0.1版本libpqxx.dll,包含头文件#include "pqxx\pqxx" 出现这个错误: fatal error C1189: #error:  "Oops: min() and/or max() are defined as preprocessor macros.  Define NOMINMAX macro before including any system headers!" 2.原

Math.min() Math.max() Math.min().apply() Math.max() .apply()该如何使用???

Math.min()和 Math.max()  语法: Math.min(x,y) Math.max(x,y) 虽然能取到最小值和最大值,但是不支持数组. 那么如何计算数组中的大小值呢????????????????????? Math.min().apply()  和   Math.max() .apply() 语法: Math.min.apply(obj,args); Math.max.apply(obj,args); 第一个参数obj对象将代替Function类里this对象,第二个参数是

max(min)-device-width和max(min)-width的区别

max-device-width和max-width的区别 max-device-width和max-width是有区别的,表现在如下几个方面: 1.max-device-width是设备整个显示区域的宽度,例如,真实的设备屏幕宽度. 2.max-width是目标显示区域的宽度,例如,浏览器宽度. 3.如果使用max-device-width,那么在PC浏览器上浏览网页时,缩小或放大浏览器时是不执行CSS的,因为“PC设备”没有变化.但如果使用max-width,缩小或放大浏览器时是执行CSS的

CSS进阶(一)width & height

禁用默认行为可以使拖动行为更加流畅,如a标签 块级元素不是指拥有display:block声明的元素 块级元素具有的换行特性,它们都可以使用clear来清除浮动带来的效果 display:inline-block实际上是两个容器,外在容器负责布局,内在容器负责大小 width深入 inline-block 浮动元素 绝对定位元素都有智能的包裹性 首选最小宽度 width设置为0时,图片和文字的权重大于布局 (1)东亚文字显示为单个最小文字的宽度 (2)西方文字特定的最小宽度由英文字符单元决定.一

关于width属性max/min-content和fit-content

自适应内部元素 在css3中width的新的属性max/min-content和fit-content.fill-availablea属性,作用是什么? 兼容性如图,在移动端已经使用,目前都有是有前缀: 例如: .min-content { width: -webkit-min-content; width: -moz-min-content; width: min-content; } 分别介绍一下这三个属性的意义: 1.fill-available的意义——自动填满剩余的空间 就是有个div

css width="100" style ="width:100px" 区别

1. width="100"是正确的,而 width="100px"是错误的, style = "width:100px"是正确的 2. style ="width:100px"优先级较高 3. 只有有限的元素支持width="100"属性,例如table, td等 4. JQuery中获取width如下 <div style="width:200px;height:200px;"