HTML和CSS的width属性之间有什么区别？

小编典典

HTML和CSS的width属性之间有什么区别？

css

可以在这里找到代码：

<!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"内img标签。它们都是必需的吗？（在这种情况下，CSS似乎覆盖了HTML属性）关于它们之间的区别是否有任何解释？

阅读 347

2020-05-16

共1个答案

小编典典

我检查了文档，但是它们并不清楚如果同时设置了它们。

那藏在这里的某个地方：

UA可以选择使用HTML源文档中的表示属性。如果是这样，则将这些属性转换为对应的CSS规则，其特异性等于0，并且将其视为在作者样式表的开头插入。因此，它们可能会被后续的样式表规则覆盖。在过渡阶段，此策略将使样式属性更容易与样式表共存。

现在，正如我在幽默评论中所隐含的那样，我不确定 为什么 它们会为元素width上的HTML 属性设置各种值，而为所有img元素的CSS
width属性设置一个单独的不同值。也许他们在解释何时.thumbnail缺少课程或其他原因。与往常一样，[Alohci可以更好地解释为什么仍然指定width和height属性，即使它们由于任何原因与CSS中指定的尺寸不同。

但是，我可以告诉您的是，这基本上意味着CSS确实确实具有优先级，即使同时设置了两者。

2020-05-16