-2

我在下面做了不同的单词在一个大的 DIV 框中有不同的字体大小。HTML 验证器向我抛出错误消息，我不明白为什么。下面的代码有什么问题？

我的CSS：

#fsize1 {
        font-size: 26px;   
        color: #ffffff;
}

#fsize2 {
    font-size: 23px;
    color: #ffffff;
}

#fsize3 {
    font-size: 20px;
    color: #ffffff;   
}

#fsize4 {
    font-size: 17px;
    color: #ffffff;
}

#fsize5 {
    font-size: 14px;   
    color: #ffffff;
}

#fsize6 {
    font-size: 11px;  
    color: #ffffff;  
}

#fsize1, #fsize2, #fsize3, #fsize4, #fsize5, #fsize6 {
   margin-right: 7px;
}

我的 HTML

<a href="http://www.mysite.com" class="box1">
<div id="fsizes"><span id="fsize3">aaaaaaaa</span><span id="fsize5"> 
bbbbbbbbb</span><span id="fsize2">ccccccccccccc</span>
<span id="fsize6">ddddddddddddddddddddd</span><span
id="fsize1">eeeeeeeeeeeeee</span><span id="fsize4">fffffffff</span></div></a>

<a href="http://www.mysite.com" class="box2">
<div id="fsizes"><span id="fsize1">aaaaaaaa</span><span id="fsize2"> 
bbbbbbbbb</span><span id="fsize4">ccccccccccccc</span>
<span id="fsize3">ddddddddddddddddddddd</span><span
id="fsize5">eeeeeeeeeeeeee</span><span id="fsize6">fffffffff</span></div></a>
4

5 回答 5

3

您有两个 ID 为“fsizes”的 div 和两个 ID 为“fsize3”的跨度。

如果您希望它们在 css 中具有相同的引用，那么您应该给它们相同的类名，而不是相同的 id。

要在 css 中使用类选择器，只需将“#”替换为“。”

于 2013-06-14T13:15:50.897 回答
1

id 不应在 html 文件中分配两次。你的两个 div 都有 id fsizes。考虑将 id 更改为类，并将您的 css 文件从更改#fsizes为.fsizes

于 2013-06-14T13:17:56.493 回答
1

你在至少两个地方有相同的 id （虽然我的猜测无处不在）你在<span id="fsize3">这里：

<span id="fsize3">aaaaaaaa</span>

和这里：

<span id="fsize3">ddddddddddddddddddddd</span>

html规范说这是无效的：

id = name [CS] 此属性为元素分配名称。此名称在文档中必须是唯一的

于 2013-06-14T13:17:14.830 回答
0

To add to what Javalsu mentioned, you also have spans with the same ID's too. I would change your span ID's to classes if you plan on using them like you have in the OP.

For example, in the html: 

<span class="fsize3">aaaaaaaaaa</span>

Then in your CSS:

SPAN.fsize3 { //do something; }

or

.fsize3 { //do something; }

I would have added this as a comment to Javaslu's, but it's not letting me.

于 2013-06-14T13:23:19.483 回答
0

You are using the same ID for multiple elements in your code.

In HTML the ID attribute is used to identify a single, unique element. If you wish to apply same style rules to several elements, you better define a group of elements by using the attribute class on the elements you want to group.

HTML

<div id="first-element" class="fsize1"></div>
<div id="second-element" class="fsize1"></div>
<div id="third-element" class="fsize1"></div>

CSS

.fsize1 {
    font-size: 26px;   
    color: #ffffff;
}
于 2013-06-14T13:23:56.470 回答