Bad Semantics

Question

为什么你不能在CSS中使用数字，还有其他方法可以完成这项工作吗？我有以下代码：

<div class="center 400-width" id="position">
    <div class="" id="header">
        Header
    </div>
    <div class="" id="content">
        Content
    </div>
    <div class="" id="footer">
        Footer
    </div>
</div>

CSS选择类400-width，这意味着容器的宽度为400px。 background-color用于检查是否属实。

.400-width{
    width:400px;
    background-color:blue;
    color:white;
}

现在没有发现，因为你可以看到here

我通过将400-替换为four来解决问题。所以它变成了fourwidth。

Answer 1

我遇到了同样的问题....实际上它不是问题..

而不是'.400-width'使用'.width-400'

Answer 2

这可以帮助你理解css的语义

css semantic

Bad Semantics

<div class="article">
  <div class="article_title">Smurf Movie Kinda Sucks</div>
  <div class="the_content">Not surprisingly, this weeks release of
     <div class="darkbold">The Smurfs</div> kinda sucks.</div>
</div>

良好的语义

<article>
  <h1>Smurf Movie Kinda Sucks</h1>
  <p>Not surprisingly, this weeks release of
     <b>The Smurfs</b> kinda sucks.</p>
</article>

Answer 3

.width-400{
    width:400px;
    background-color:blue;
    color:white;
}

Answer 4

CSS类名不能以数字开头，它们必须以字母开头;在进行网格系统等之前，这已经让我感到困惑。您可以使用width-400或简洁w400。

Answer 5

._400-width{
    width:400px;
    background-color:blue;
    color:white;
}

Answer 6

根据W3C spec CSS标识符不能以数字开头，但如果您想保留JSON.stringify(localStorage);，则可以使用一个小技巧并将前导数字400-width替换为n喜欢

\3n

在这里，您可以使用in your jsfiddle，加上少数other samples，和相关的SO comment

CSS无法选择带有数字的类/ id？

6 个答案:

Bad Semantics

良好的语义