width属性,width属性值有哪些
在html中怎样控制表格的宽度
表格的宽度设置都知道：?table width="960px"?border="1" align="center"../table
宽度虽然是这样设置的，但是td的内容如果超出就还是可能会改变table的宽度，
这样就有两种情况，如果你不想改变宽且也不想改变行高，可是设置:?overflow: hidden;
text-overflow:ellipsis;
而如果你的高度可以改变，及单元格的内容超出可以自动换行的话，可以设置 table style="
word-break: break-all; ?word-wrap:break-word;" ......
HTML表格宽度和高度属性WIDTH、HEIGHT
默认情况下，表格的宽度和高度根据内容自动调整，我们也可以手动设置表格的宽度和高度。
基本语法
TABLE
WIDTH=VALUE
HEIGHT=VALUE
语法解释
通过WIDTH属性定义表格的宽度，HEIGHT属性定义表格的高度，单位是像素或百分比。如果是百分比，则可分为两种情况：如果不是嵌套表格，那么百分比是相对于浏览器窗口而言；如果是嵌套表格，则百分比相对的是嵌套表格所在的单元格宽度。
文件范例：10-3.htm
设定表格的宽度和高度。
01
!--
------------------------------
--
02
!--
文件范例：10-3.htm
--
03
!--
文件说明：设定表格的宽度和高度
--
04
!--
------------------------------
--
05
HTML
06
HEAD
07
TITLE设定表格的宽度和高度/TITLE
08
/HEAD
09
BODY
10
H1主流的网页设计软件/H1
11
TABLE
BORDER=1
WIDTH=400
HEIGHT=100
12
TR
13
TD网页图像软件/TDTDFireworks/TD
14
/TR
15
TR
16
TD网页制作软件/TDTDDreamweaver/TD
17
/TR
18
TR
19
TD网页动画软件/TDTDFlash/TD
20
/TR
21
/TABLE
22
/BODY
23
/HTML
文件说明
第11行定义了表格的宽度为400像素，高度为100像素。
php数据控制css中的width大小
width属性的使用方法进行总结。
width属性的使用
1. 解析width:100%;与width:auto;的区别
如果是p的width:100%，则说明p的width会得到980px就已经充满p区域，然后自己又有padding，所以会超出p。而当width:auto时它是总体宽度（包括width，margin,padding,border）等于父级宽度（width，不包含父级的margin,padding,border），所以如果padding已经左右占去10px的空间，那么width给的值就是960px。但无论是width:100%还是auto，其计算的参照都是父级内容区width值，而非总宽度值.
2. CSS调节图片的大小，要知道width、height
如何用css调整图片的大小，使用width和height这两个属性，这两个属性分别是用来设置元素的宽度和高度的。在CSS初学阶段，全部都是使用像素作单位。
3. css
宽度
width
宽度都是直接设置标签对象宽度，并且注意“等号”后跟具体数字宽度值（或百分比），具体宽度值不用跟长度单位，默认以像素(px)为单位，在TABLE表格标签或图片img标签内设置宽度时候其值不跟html单位，默认以像素为单位。
4. CSS2.1SPEC：视觉格式化模型之width属性详解(上)
width属性有几种不同的取值方式，有几下几种：
(1)宽度值：也就是用CSS长度值来明确地规定一个盒子的宽度，取值单位可以用CSS中支持的长度单位，比如px,em等。
(2)百分比：百分比是根据
包含块的宽度来计算的。但是如果包含块的宽度需要根据包含的内容来决定，那么最终的布局是未定义的，也就是标准中没有明确规定如何计算宽度值。另外，如果盒子是绝对定位的，那么它的百分比长度在计算时是根据包含块的
padding
edge的宽度来计算的。
(3)auto：根据CSS标准中规定的宽度计算方法来计算，具体的算法下文中将详细介绍
(4)inherit：事实上width属性是不可继承的，很奇怪为什么会有inherit这个选项，实际情况中width属性一般也很少用到inherit值
5. CSS2.1SPEC：视觉格式化模型之width属性详解(下)
"shrink-to-fit"算法的计算过程：
[1]计算preferred-width:在
除非包含的内容有明确的换行符(比如有br/标签时)，否则就不换行的情况下，容纳其包含的内容所需要的宽度。
[2]计算preferred-min-width:在
能换行时(英文碰到空格或标点符号，出现了块级元素，当然也包含出现了br/标签时)就换行的情况下，容纳所包含的内容需要的宽度。
[3]计算available-width:即利用2.2.3节中的公式：
available-width
=width
of
containing
block
-
'margin-left'
-
'border-left-width'
-
'padding-left'
-
'padding-right'
-
'border-right-width'
-
'margin-right，这里也包括所有滚动出去的宽度。
最终的width则为：min(preferred-width,
max(preferred-min-width,
available-width))。最终的公式可以总结为：最终的宽度以available-width为基准，同时保证不能大于preferred-width以及不能小于preferred-min-width
web前端学习HTML表格的属性标记有哪些？
HTML表格的基本结构包括table、caption、tr、td、th等标记
1：table标记有以下属性
① width属性：表示表格的宽度
② height属性：表示表格的高度
③ border属性：表示表格外边框的宽度
④ align属性表示表格的显示位置：left居左显示；center居中显示；right居右 显示。
⑤ cellspacing属性：单元格之间的间距
⑥ cellpadding属性：单元格内容与边框的显示距离
⑦ frame属性：控制表格边框外层的四条线框
⑧ rules属性：控制显示单元格之间的分割线
2：caption标记用于表格中使用标题
caption标记的align属性有四个取值：
① top表示标题放在表格的上部
② bottom表示标题放在表格的下部
③ left表示标题放在表格的左部
④ right表示标题放在表格的右部
3：tr标记用来定义表格的行，对于每一个表格行，都是由一对tr.../tr标记表示。tr标记有如下几种属性
① bgcolor属性用来设置背景颜色
② align属性用来设置垂直方向对齐方式
③ valign属性用来设置水平方向对齐方式
4：td和th都是单元格的标记，其必须嵌套在tr标记中，成对出现。th是表头标记，th中的文字会被默认加粗，而td不会，td是数据标记，表示该单元格的具体数据。两者的标记属性是一样的：
① bgcolor属性用来设置背景颜色
② align属性用来设置垂直方向对齐方式
③ valign属性用来设置水平方向对齐方式
④ width属性用来设置表格的宽度
⑤ height属性用来设置表格的高度
⑦ rowspan设置单元格所占行数
⑧ colspan设置单元格所占列数
width属性的合法值
1 .width作用在内在盒子，也就是容器盒子
auto是width的默认值，尽管这样，却也是一个深藏不漏的家伙
如图，不设置white-space:nowrap的时候，宽度不会超，只会向下
如图，如果加了white-wrap:nowrap;会超出容器限制
1 .在css世界中，盒子分为“内在盒子”，‘外在盒子’，显示也分为“内部显示”，‘’外部显示‘。尺寸也分为“内部尺寸”，’外部尺寸‘
2 .内部尺寸英语是'intrinsic sizing',表示尺寸由内部元素决定，外部尺寸“extrinsic sizing”,宽度由外部元素决定
1 .正常流宽度.当我们往页面中添加一个div元素，div的尺寸就像是流铺满元素一样，会铺满整个容器，但是这并不等于这个div的宽度是width:"100%".所以当把一个元素设置为display:block的时候，在加一条width:100%是不对的。这俩是互斥的，给一个元素添加宽度是会破坏他的流动性
2 .格式化宽度：在绝对定位模型中，默认是包裹性，宽度由内容决定，但是如果有以下属性，left/righ或top/bottom对立方位的属性值同时存在的时候，他的宽度表现为格式化宽度，宽度大小由最近的具有定位特性(position的值不是static)的祖先元素计算而来
1 .尺寸的大小由内部的元素决定。如果一个元素没有内容的时候他的宽度是0，那么这个元素就是由内部元素决定
3 .内部尺寸的三种表现形式
1 .元素尺寸由内部元素决定，会永远小于“包含块”容器的尺寸。对于一个元素如果display：inline-block，那么即使里面内容再多，只要是正常文本，宽度也不会超过容器
2 .Button元素，按钮就是最具代表性的inline-block元素。按钮文字越多，宽度越高，如果文字足够多，则会在容器的宽度处自动换行。
1 .也就是css不会在width:auto的时候，并且有图文的时候不会是0的。会选最小宽度的
2 .汉字的时候，最小宽度是一个汉字的宽度
3 .英语单词的时候，最小宽度有额定的英文字符单元决定
4 .使用情况，画一些图形:利用连续单词不换行的特性，可以控制什么时候换行，什么时候正常显示，所以可以非常方便实现这些凹凸的形状
1 .最大宽度就是元素可以有的最大宽度。实际上最大宽度实际等同于“包裹性”。如果设置了withe-space:nowrap。那就是最后没有换行的宽度。如果内部没有块级元素或块级元素没有设置宽度值，那么最大宽度实际上是最大的连续内联盒子的宽度
2 .连续内联盒子就是全部都是内联级别的一个或一堆元素，中间没有任何的换行标签br或其他块级元素
3 .实际用处:实现滚动
1 .上面全部都只是说了width:auto的点，别的都没说
2 .width宽度直接作用在内在盒子上，内在盒子是由content box，padding box,border box,margin box。
3 .margin的背景永远是透明的，因此不能作为background-clip,background-origin属性值出现。
4 .100px作用在了content box上，但是由于div默认的padding,border,margin都是0，因此div所呈现的宽度就是100像素.如果此时padding，border也有值的话，那么最后的表现就不是100px.一定比这个大
1 .流动性丢失，对于块状元素来说，如果是width:auto的话，元素会如水流般充满整个元素，一旦设定了width具体数值，元素的流动性就会被阻断，因为元素给定宽度就像河流中间竖起两个大闸一样，流动性丢失
2 .与现实世界表现不一致.包含padding或border会让元素宽度变大。我们设置100像素宽度，其实希望是整个元素的最终宽度是100px,而不是最后比这个大.-解决方式-宽度分离原则:和宽度有关的属性要分在两个地方写，比如父元素写width属性，子元素做padding,border这些属性
3 .解决方式2，使用box-sizing属性：他可以改变width作用的细节.box-sizing属性值
4 .注意box-sizing不持之margin,只有当元素没有水平margin的时候，box-sizing才能真正无计算，上面提到的宽度分离元素是可以真正解决这个问题的
5 .唯一离不开box-sizing的元素就是input和textarea元素,让他们实现100%自适应宽度
设置width和height属性的时候,取值有哪些()？
当设置 width 和 height 属性时，可以使用数字值，表示像素值。例如，width="100" 表示元素的宽度为 100 像素。也可以使用百分比值，表示宽度或高度相对于父元素的宽度或高度的百分比。例如，width="50%" 表示元素的宽度为父元素的宽度的一半。
除了数字值和百分比值，还可以使用关键字 auto。如果使用 auto 值，则浏览器将自动计算宽度或高度的值，通常根据元素的内容自动调整。
总之，可以使用数字值、百分比值和 auto 关键字来设置 width 和 height 属性。