HTML和CSS的width属性有什么区别? [英] What's the difference between HTML's and CSS's width attribute?

查看:270
本文介绍了HTML和CSS的width属性有什么区别?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

代码可以在这里找到:

http://www.w3schools.com/css/tryit.asp?filename=trycss_float_elements

<!DOCTYPE html>
<html>
<head>
<style>
.thumbnail 
{
float:left;
width:110px;
height:90px;
margin:5px;
}
</style>
</head>

<body>
<h3>Image Gallery</h3>
<p>Try resizing the window to see what happens when the images do not have enough room.</p>
<img class="thumbnail" src="klematis_small.jpg" width="107" height="90">
<img class="thumbnail" src="klematis2_small.jpg" width="107" height="80">
<img class="thumbnail" src="klematis3_small.jpg" width="116" height="90">
<img class="thumbnail" src="klematis4_small.jpg" width="120" height="90">
<img class="thumbnail" src="klematis_small.jpg" width="107" height="90">
<img class="thumbnail" src="klematis2_small.jpg" width="107" height="80">
<img class="thumbnail" src="klematis3_small.jpg" width="116" height="90">
<img class="thumbnail" src="klematis4_small.jpg" width="120" height="90">
</body>
</html>

我发现有 width:110px; style 标签,并且内还有 width =107 code>标记。它们都是必要的(在这种情况下,CSS看起来会覆盖HTML属性)对它们之间的区别有什么解释吗?

I find that there is width:110px; within style tag, and there is also width="107" within img tag. Are both of them necessary?(It seems that the CSS overwrites HTML attributes in this case) Is there any explaination about the difference between them?

推荐答案



我检查了文档,但他们不清楚如果两者都设置会发生什么。

这隐藏在某处此处

That's hidden away somewhere here:


UA可以选择尊重HTML源文档中的演示属性。如果是,这些属性被转换为特定等于0的相应CSS规则,并且被视为如同它们被插入到作者样式表的开始处。因此,它们可以被随后的样式表规则覆盖。在过渡阶段,此策略将使样式属性更容易与样式表共存。

The UA may choose to honor presentational attributes in an HTML source document. If so, these attributes are translated to the corresponding CSS rules with specificity equal to 0, and are treated as if they were inserted at the start of the author style sheet. They may therefore be overridden by subsequent style sheet rules. In a transition phase, this policy will make it easier for stylistic attributes to coexist with style sheets.

现在,我隐藏在我的幽默评论中,我不知道为什么他们会为HTML width 属性设置各种值 img 元素,并且对于所有的CSS width 属性具有单个不同的值。也许他们正在考虑 .thumbnail 类丢失或其他原因。一如既往, Alohci在一个更好的位置解释为什么 width height 属性仍然指定,即使它们与CSS中指定的尺寸有所不同。

Now, as I've implied in my humorous comment, I don't know for certain why they would set a variety of values for the HTML width attribute on the img elements and have a single, different value for the CSS width property for all of them. Perhaps they're accounting for when the .thumbnail class is missing, or something else. As always, Alohci is in a better position to explain why the width and height attributes are specified anyway, even if they differ from the dimensions specified in CSS for whatever reason.

但是,我可以告诉你,这基本上意味着CSS确实优先,即使两者都设置。

What I can tell you, however, is that this basically means the CSS does indeed take precedence anyway, even if both are set.

这篇关于HTML和CSS的width属性有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆