html页面设定高度和宽度的属性

本文目录

• html页面设定图片高度和宽度的属性
• css中style=“width:100px“ 和width=“100px“有什么不同
• 如何用CSS分别单独定义IE6、7、8的width属性
• css的width属性可以去到哪些数值
• 求各位大神解答：HTML语言中的width和height属性，百分比有什么作用，举例说明！
• 在html中怎样控制表格的宽度
• VB对象的Width Height和ScaleWidth,ScaleHeight属性有何区别
• 如何设置span的width属性

html页面设定图片高度和宽度的属性

宽度和高度属性分部是width和height。
这两个属性可以直接设置图片的宽高，如果用了css样式控制了图片的宽高，则优先使用样式当中的宽高值。css3当中还可以设置图片的自适应，避免图片变形。

css中style=“width:100px“ 和width=“100px“有什么不同

width=“100“有局限性，也就是部分标签才由此属性，比如img、table、td等标签
也就是说，width=“100“是标签属性，而不是css
style=“width:100px“
是css属性，适用于大部分标签，比如div、span、ul、li等等等等
也就是说，style=“width:100px“适合对没有width属性的标签进行css样式定义，而width是只适合有这种属性的标签，要说分别，这就是分别！
但最终效果一样，都是定义某元素标签的宽度

如何用CSS分别单独定义IE6、7、8的width属性

使用CSS hack进行设置。CSS hack的目的就是使你的CSS代码兼容不同的浏览器。当然，我们也可以反过来利用CSS hack为不同版本的浏览器定制编写不同的CSS效果。

1.原理

　　由于不同的浏览器对CSS的支持及解析结果不一样，还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。

　
　CSS Hack大致有3种表现形式，CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack，CSS
Hack主要针对类内部Hack：比如 IE6能识别下划线“_“和星号“ * “，IE7能识别星号“ *
“，但不能识别下划线“_“，而firefox两个都不能认识。等等

　　选择器Hack：比如 IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。等等

　
　HTML头部引用(if IE)Hack：针对所有IE：《!--[if
IE]》《!--您的代码--》《![endif]--》，针对IE6及以下版本：《!--[if lt IE
7]》《!--您的代码--》《![endif]--》，这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都
会生效。

　　书写顺序，一般是将识别能力强的浏览器的CSS写在后面。下面如何写里面说得更详细些。

2、常用的CSS hack方式

　　

　　（1）方式一 条件注释法

　　只在IE下生效

　　《!--[if IE]》

　　这段文字只在IE浏览器显示

　　《![endif]--》

　　只在IE6下生效

　　《!--[if IE 6]》

　　这段文字只在IE6浏览器显示

　　《![endif]--》

　　只在IE6以上版本生效

　　《!--[if gte IE 6]》

　　这段文字只在IE6以上(包括)版本IE浏览器显示

　　《![endif]--》

　　只在IE8上不生效

　　《!--[if ! IE 8]》

　　这段文字在非IE8浏览器显示

　　《![endif]--》

　　非IE浏览器生效

　　《!--[if !IE]》

　　这段文字只在非IE浏览器显示

　　《![endif]--》

　　（2）方式二 类内属性前缀法

　　属性前缀法是在CSS样式属性名前加上一些只有特定浏览器才能识别的hack前缀，以达到预期的页面展现效果。

　　IE浏览器各版本 CSS hack 对照表

说明：在标准模式中

“-″减号是IE6专有的hack

“\9″ IE6/IE7/IE8/IE9/IE10都生效

“\0″ IE8/IE9/IE10都生效，是IE8/9/10的hack

“\9\0″ 只对IE9/IE10生效，是IE9/10的hack

（3）CSS hack方式三：选择器前缀法

选择器前缀法是针对一些页面表现不一致或者需要特殊对待的浏览器，在CSS选择器前加上一些只有某些特定浏览器才能识别的前缀进行hack。

目前最常见的是

*html *前缀只对IE6生效*+html *+前缀只对IE7生效@media
screen\9{...}只对IE6/7生效@media \0screen {body { background: red;
}}只对IE8有效@media \0screen\,screen\9{body { background: blue;
}}只对IE6/7/8有效@media screen\0 {body { background: green; }}
只对IE8/9/10有效@media screen and (min-width:0\0) {body { background: gray;
}} 只对IE9/10有效@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {body { background: orange; }} 只对IE10有效等等

3、实际应用

比如要分辨IE6和firefox两种浏览器，可以这样写：

div{
background:green;/*forfirefox*/
*background:red;/*forIE6*/(bothIE6&&IE7)
}

我在IE6中看到是红色的，在firefox中看到是绿色的。

　　解释一下：

　　上面的css在firefox中，它是认识不了后面的那个带星号的东西是什么的，于是将它过滤掉，不予理睬，解析得到的结果是:div{background:green},于是理所当然这个div的背景是绿色的。

　　在IE6中呢，它两个background都能识别出来，它解析得到的结果是:div{background:green;*background:red;},于是根据优先级别，处在后面的red的优先级高，于是当然这个div的背景颜色就是红色的了。

4、所以单独定义IE6、7、8的width属性代码如下

div{
width:200px;/*所有浏览器都能识别 包括IE7*/
-width:180px;/*只有IE6识别，识别后会覆盖通用width的设置，达到IE6单独设置的效果*/
-width:180px\0;/*IE8以上的浏览器识别，识别后会覆盖通用width的设置，达到IE8单独设置的效果*/
}

css的width属性可以去到哪些数值

可能的值：

auto    这是默认值。由浏览器计算出实际的宽度。

数值+单位    使用 px、cm 等单位定义宽度。

数值%    定义基于包含块（父元素）宽度的百分比宽度。

inherit    规定应该从父元素继承 width 属性的值。

求各位大神解答：HTML语言中的width和height属性，百分比有什么作用，举例说明！

width和height属性是指你设置的宽度和高度，百分比指你设计的东西占屏幕大小的百分比。
例如你在写一个表格的时候：
《html》
《head》《/head》
《body》
《table border=“1“ width=“80%“ height=“50%“》
《tr》
《td》QQ《/td》
《td》QQ《/td》
《td》QQ《/td》
《/tr》
《tr》
《td》QQ《/td》
《td》QQ《/td》
《td》QQ《/td》
《/tr》
《tr》
《td》QQ《/td》
《td》QQ《/td》
《td》QQ《/td》
《/tr》
《/table》
《/body》
《/html》
你通过调整百分比可以看到表格占总页面的大小的比例也随之改变！
希望以上对你有用！

在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;“ ...》...

VB对象的Width Height和ScaleWidth,ScaleHeight属性有何区别

VB对象的Width，Height和ScaleWidth，ScaleHeight属性区别为：对象不同、影响不同、基点不同。

一、对象不同

1、Width，Height属性：Width，Height属性是控件外部的宽度和高度。

2、ScaleWidth，ScaleHeight属性：ScaleWidth，ScaleHeight属性是控件内部的宽度和高度。

二、影响不同

1、Width，Height属性：Width，Height属性受到控件所在的父容器控件的ScaleMode模式影响。

2、ScaleWidth，ScaleHeight属性：ScaleWidth，ScaleHeight属性受到控件本身的ScaleMode模式影响。

三、基点不同

1、Width，Height属性：Width，Height属性的坐标系以窗体的左上角为基点。

2、ScaleWidth，ScaleHeight属性：ScaleWidth，ScaleHeight属性的坐标系以控件左上角的左上角为基点。

如何设置span的width属性

如果设置display:block，width属性生效，但是此时的span跟div一样了。如果设置display:inline-block，则span并列在同行，而且width属性生效。 元素display属性的常见值说明： 1）block：块对象的默认值。将对象强制作为块对象呈递，为对象之后添加新行。2）inline：内联对象的默认值。将对象强制作为内联对象呈递，从对象中删除行。3）inline-block：将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内。4）non：隐藏对象。