在 w3c 中验证时出现 CSS 解析错误答案

【问题标题】：CSS Parse Error When Validating in w3c在 w3c 中验证时出现 CSS 解析错误
【发布时间】：2015-11-06 23:43:35
【问题描述】：

当我尝试在 w3c 上验证我的 CSS 代码时，它给了我这些错误，很抱歉，如果这已经被问过了，但我似乎找不到答案。一些错误已修复，但这些错误仍然存在。

Parse Error <html> <head> > <title>style2.CSS</title> </head> <body> html{ background-image: url(headerimg.jpg);    }

130 解析错误

<head>
    <meta http-equiv="content-type";content="text/html";charset="UTF-8"/>

    <title>style2.CSS</title>

</head>

<body>

html{
background-image: url(headerimg.jpg);   


}
header{

background-image: url(headerimg.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size:1000px 150px;


}

body{

background-image:url(bg.jpg);
padding-left:175px;
padding-right:175px;
width:940px;
}



#text{

background-color:white;
padding-top:0px;    
padding-left:20px;
padding-right:69.5px;
width:600px;
padding-bottom:0px;
display:inline-block;


}

#headchoix{

background-color:#333;
height:50px;

word-wrap: normal;
padding-top:30px;
}
 #bot{

float: top;
float:right;
background-color:#D3D3D3;
height:713px;
padding-left:0.1px;
width:250px;
}
#top1,#top2,#top3,#top4,#top5,#top6{
padding-right:40px;
color:white;    
padding-left:10px;
font-size:150%;
 font-weight: bold;
  text-decoration:none; 
}
#pad{

float:left;
}
#footerchoix{

background-color:#333;
width:940px;
height:160px;
display:inline-block;
}

#aside2,#aside1{
float:left;
padding-right:170px;
color:white;
}
#aside3{
float:left;
color:white;
}
#aside4{
float:right;
color:white;
width:200px;
}


a:visited{
color:black;
}
a:hover{

color:red;
}
a:active{

color:yellow;
}

a:link{
color:blue;
}


</body>

【问题讨论】：

您说的是 CSS，但您似乎验证了 HTML（以 CSS 代码作为内容）。

标签： html css parsing w3c

【解决方案1】：

您的元标记有错误的分号：

这个：

<meta http-equiv="content-type";content="text/html";charset="UTF-8"/>

应改为：

<meta http-equiv="content-type" content="text/html" charset="UTF-8" />

正如验证器所暗示的，content 属性之前的分号处存在解析错误。那是因为您不应该用分号分隔属性。您使用空白字符来分隔属性。

【讨论】：

【解决方案2】：

你应该把 CSS 放在样式标签里

<style>
html{
background-image: url(headerimg.jpg);   


}
header{

background-image: url(headerimg.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size:1000px 150px;


}

body{

background-image:url(bg.jpg);
padding-left:175px;
padding-right:175px;
width:940px;
}



#text{

background-color:white;
padding-top:0px;    
padding-left:20px;
padding-right:69.5px;
width:600px;
padding-bottom:0px;
display:inline-block;


}

#headchoix{

background-color:#333;
height:50px;

word-wrap: normal;
padding-top:30px;
}
 #bot{

float: top;
float:right;
background-color:#D3D3D3;
height:713px;
padding-left:0.1px;
width:250px;
}
#top1,#top2,#top3,#top4,#top5,#top6{
padding-right:40px;
color:white;    
padding-left:10px;
font-size:150%;
 font-weight: bold;
  text-decoration:none; 
}
#pad{

float:left;
}
#footerchoix{

background-color:#333;
width:940px;
height:160px;
display:inline-block;
}

#aside2,#aside1{
float:left;
padding-right:170px;
color:white;
}
#aside3{
float:left;
color:white;
}
#aside4{
float:right;
color:white;
width:200px;
}


a:visited{
color:black;
}
a:hover{

color:red;
}
a:active{

color:yellow;
}

a:link{
color:blue;
}
</style>

在head标签中包含这个

【讨论】：