HTML 4.01和HTML5

Question

为什么我难以通过外部链接的CSS文件与HTML元素接壤？救命！我的HTML中的代码：

<html>
  <head>
    <link href='n.css' rel='stylesheet' type='text/css'/>
  </head>
  <body>
    <section  id='1id' class='2class 3class 4class'>
      I am bordered & got 1 ID & 3 classes,oh ye!
    </section>
  </body>
</html>

我的n.css文件如何显示：

<style>
  #1id {border:2;}
  .2class{text-decoration:underline;}
  .3class{text-style:italic;}
  .4class{font-weight:bold;}
</style>

Answer 1

首先，您必须了解修复代码的一些要点

1。请勿在{{1}}文件中使用<style>标记...如果您在.css文件中编写css，请使用该标记

2。 css中没有.html属性...请使用text-style

3。在font-style和id 开头使用数字不是一个好习惯（这里也是{{1}的解决方案}和class以数字开头）

4。您使用id的无效值，即class ...使用border

注意：为了更好的编码，不要在同一个元素上使用多个类来设置样式......你可以在同一个类中应用多个样式

解决方案1  （border:2和border:2px solid currentcolor不以数字开头）

Stack Snippet

id

class

Solution2 （#id1 { border: 2px solid currentcolor; } .class2 { text-decoration: underline; } .class3 { font-style: italic; } .class4 { font-weight: bold; }和<section id='id1' class='class2 class3 class4'> I have 3 classes and 1 id oh ye! </section>以数字开头）

HTML 4.01和HTML5

之间的ID有何不同

HTML 4.01 规范声明 ID 令牌必须以字母（[A-Za-z]）开头，可以跟随任意数量的字母，数字（[0-9]），连字符（ - ），下划线（_ ），冒号（：）和句点（。）。对于class属性，没有这样的限制。类名可以包含任何字符，并且它们不必以字母开头有效。

HTML5摆脱了对 id 属性的额外限制。剩下的唯一要求 - 除了在文档中唯一 - 是值必须包含至少一个字符（不能为空），并且它可以' t包含任何空格字符。

这意味着适用于类和 id 属性值的规则现在在 HTML5 中非常相似。



<强> Reference for id starts with special character



<强> Reference for class starts with special character

在这里，您必须在数字后添加id前缀，然后再添加一个空格。

Stack Snippet

class

\3

Answer 2

您可以在外部css中设置边框，与内部css相同比如假设你的.2class还有一件事就是尝试用字母开始上课。

.2class{ border:1px solid black;}

它会为你提供.2class

之外的黑色边框

Answer 3

#1id{
    border:2px solid #999;
    padding:10px;
}
.section{
    float:left;
    padding:0 5px;
    margin:-20px 0 0 30px;
    background:#fff;
}

Answer 4

从您的外部css

<style>

你的css没有参加，因为你已经开始使用数字的id和类，在这种情况下你必须为HTML5这样写。

示例id ='1id'

[id="1id"] { border : 2px solid #000; }

示例class ='2class'

[class='2class']{font-weight:bold;}

你不能使用超过1个以class ='2class 3class 4class'开头的类

[id="1id"] { border : 2px solid #000; }
[class='2class']{font-weight:bold;}

<section  id='1id' class='2class'>
I have 1 id and 1 class oh ye!
</section>

Answer 5

主要错误是#1id {border:2;} 通过将'solid color'和'px'-添加到：

进行了更正

#id1{border:2px solid currentcolor;}

另外两个次级错误是在css文件中使用<style></style>，并使用1id，2class等编号启动ID和CLASSES。启动ID和CLASSES的正确方法如id1，class2，等

使用外部链接的CSS将边框应用于html元素

5 个答案:

HTML 4.01和HTML5