CSS中是否允许百分比宽度（特别是CSS3）？

Question

据我了解，HTML5不支持百分比宽度。必须以像素为单位指定宽度等。 （如果我错了，请纠正我。）

但是，我是否允许在CSS中创建一个元素，将其宽度指定为百分比，然后在HTML5页面上使用该元素？ （我已经尝试过了，它做了我想做的事，但这是最佳做法吗？）

---

虽然这是一般性的问题，但我试图实现的具体事情是<table>元素：

<table class="wideTable">

然后CSS看起来像这样：

table.wideTable {
  border-collapse: collapse;
  width: 100%;
}

---

非常感谢Daniel Beck的非常彻底的回答。似乎完全支持CSS中的百分比宽度。

Answer 1

HTML5不支持百分比宽度

我怀疑你在这里指的是HTML width和height属性：

<img src="foo.jpg" width="100" height="100">

你是正确的those values are in pixels;规范说这些属性“必须具有有效的非负整数值”，因此在这些属性中使用诸如“100px”之类的值或使用其他单位（如百分比）是不正确的。

（浏览器在处理这些属性中的不正确单位时会有所不同，具体取决于单位，宽度与高度通常不同。这有点乱，不要涉及它。）

宽度和高度属性仅对某些元素有效：图像，视频，iframe等。

我可以在CSS中创建一个元素，将其宽度指定为百分比，然后在HTML5页面上使用该元素吗？

绝对没错！这可以在外部CSS中完成，或使用style属性在HTML中内联，而不是width或height属性;并且可以应用于任何具有任何显示尺寸的元素（例如，不是<br>）。

如果在同一元素上使用，样式属性将覆盖CSS，而CSS又会覆盖“width”和“height”属性：

.override {
  width: 50%;
  height: 1em;
}

<img src="https://placehold.it/100x100" width="100" height="100" class="override">

Answer 2

“如果我错了，请纠正我” - >你错了。

通常使用宽度的百分比值。