我在W3C Validator中运行我的网站只是为了给出这些错误：
<a href="#header-anchor">
<img src="img/banner.png" width="169" height="54" alt="Logo">
</a>
我得到的错误是：
我不确定导致此错误的原因，所以任何帮助都会受到赞赏。感谢。
编辑：显然这段代码导致错误，但我不确定它究竟是什么导致错误：<a href="index.html">
编辑2：整个代码：
<!DOCTYPE HTML>
<html>
<head>
<title>Title</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
<!-- Banner -->
<a class="anchor" id="header-anchor">
<div id="header-wrapper">
<header role="banner" id="header">
<a href="index.html">
<img src="img/banner.png" width="169" height="54" alt="Logo">
</a>
<nav role="navigation">
<ul>
<li><a href="#header-anchor">HOME</a></li>
<li><a href="#services-anchor">SERVICES</a></li>
<li><a href="#team-anchor">OUR TEAM</a></li>
<li><a href="#about-anchor">ABOUT</a></li>
<li><a href="#contact-anchor">CONTACT</a></li>
</ul>
</nav>
</header>
</div>
<div id="banner-wrapper">
<section id="banner">
<h2>Title</h2>
<h3>Tagline</h3>
</section>
</div>
<!-- Services -->
<a class="anchor" id="services-anchor"></a>
<div class="wrapper">
<section id="services" class="group">
<h2>Our Services</h2>
<div class="floatleft small"> <span class="fa-stack fa-3x"> <i class="fa fa-line-chart fa-stack-1x fa-inverse"></i> </span>
<h3>Service 1</h3>
<p>Service 1</p>
</div>
<div class="floatleft small"> <span class="fa-stack fa-3x"> <i class="fa fa-money"></i> </span>
<h3>Service 1</h3>
<p>Service 1</p>
</div>
<div class="floatleft small"> <span class="fa-stack fa-3x"> <i class="fa fa-globe"></i> </span>
<h3>Service 1</h3>
<p>Service 1</p>
</div>
</section>
</div>
<!-- About us -->
<a class="anchor" id="team-anchor"></a>
<section id="team" class="group">
<h2>Our Team</h2>
<div class="floatleft mid"> <img src="img/ben.jpg" width="250" height="250" alt="Ben Fitchew">
<h3>Team 1</h3>
<p>Team 1</p>
</div>
<div class="floatleft mid"> <img src="img/jeremy.jpg" width="250" height="250" alt="Jeremy Lang">
<h3>Team 1</h3>
<p>Team 1</p>
</div>
<div class="floatright mid"> <img src="img/gianluca.jpg" width="250" height="250" alt="Gianluca Monaco">
<h3>Team 1</h3>
<p>Team 1</p>
</div>
<div class="floatright mid"> <img src="img/will.jpg" width="250" height="250" alt="William Pattisson">
<h3>Team 1</h3>
<p>Team 1</p>
</div>
</section>
<!-- About -->
<div class="wrapper"> <a class="anchor" id="about-anchor"></a>
<section id="about" class="group" role="main">
<h2>About</h2>
<h3>About</h3>
<p>About</p>
</section>
</div>
<!-- Slideshow -->
<div class="wrapper">
<h2>Slideshow</h2>
<h3>Slideshow</h3>
<p class="Slideshow"><img src='images/picture1.jpg' name='SlideShow'/></p>
</section>
</div>
<!-- Javascript code -->
<script type="text/javascript">
var slideShowSpeed = 2000;
var Pic = new Array();
Pic[0]='img/picture1.jpg';
Pic[1]='img/picture2.jpg';
Pic[2]='img/picture3.jpg';
Pic[3]='img/picture4.jpg';
Pic[4]='img/picture5.jpg';
Pic[5]='img/picture6.jpg';
var currentPicture = 1;
var pictureNo = Pic.length;
var preLoad = new Array();
for (i = 0; i < pictureNo; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration=3)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[currentPicture].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
currentPicture = currentPicture + 1;
if (currentPicture >= pictureNo)
currentPicture = 0;
setTimeout('runSlideShow()', slideShowSpeed);
}
</script>
<script>
runSlideShow();
</script>
<!-- Contact -->
<a class="anchor" id="contact-anchor"></a>
<div class="map-wrapper">
<section id="contact" class="group">
<h2>Contact Us</h2>
<div id="map-canvas" class="floatleft mid"></div>
<div class="floatright mid">
<form id="frmContact" action="mail.php" method="post" role="form">
<label for="txtName" id="lblName">Name</label>
<input type="text" name="txtName" id="txtName" aria-labelledby="lblName" required placeholder="Enter your name here" minlength="3" maxlength="70" pattern="[a-zA-Z ]+">
<span class="error_show">Name is not valid!</span>
<label for="txtEmail" id="lblEmail">Email</label>
<input type="email" name="txtEmail" id="txtEmail" aria-labelledby="lblEmail" required placeholder="Enter your email here" minlength="5" maxlength="254">
<span class="error_show">Email is not valid!.</span>
<label for="txtMessage" id="lblMessage">Message</label>
<textarea name="txtMessage" id="txtMessage" aria-labelledby="txtMessage" required placeholder="Enter your message here"></textarea>
<span class="error_show">Message is not valid!</span>
<input type="submit" name="submit" id="submit" value="Send Message">
</form>
</div>
</section>
</div>
<!-- Javascript -->
<script src="js/jquery-2.1.1.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
// Code for Google Map
function initialize() {
var mapCanvas = document.getElementById('map-canvas');
var myLatLng = new google.maps.LatLng(51.51463,-0.106533);
var mapOptions = {
center: myLatLng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Ardevora'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
$(document).ready(function() {
// Form Validation Code
$('#txtName').on('input', function() {
var input=$(this);
var is_name=input.val();
if (is_name) {
input.removeClass("invalid").addClass("valid");
input.next().hide();
} else {
input.removeClass("valid").addClass("invalid");
input.next().show();
}
});
$('#txtEmail').on('input', function() {
var input=$(this);
var regex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i;
var is_email=regex.test(input.val());
if (is_email) {
input.removeClass("invalid").addClass("valid");
input.next().hide();
} else {
input.removeClass("valid").addClass("invalid");
input.next().show();
}
});
$('#txtMessage').keyup(function(event) {
var input=$(this);
var message=$(this).val();
if (message) {
input.removeClass("invalid").addClass("valid");
input.next().hide();
} else {
input.removeClass("valid").addClass("invalid");
input.next().show();
}
});
$("#submit").click(function(event) {
var form_data=$("#frmContact").serializeArray();
var error_free=true;
for (var input in form_data){
var element=$("#"+form_data[input]['name']);
var valid=element.hasClass("valid");
var error_element=element.next();
if (!valid) {
error_element.show();
error_free=false;
} else {
error_element.hide();
}
}
if (!error_free){
event.preventDefault();
}
});
});
</script>
<!-- Cookie Script -->
<script type="text/javascript">
(function(){
var msg = "We use cookies to enhance your web browsing experience. By continuing to browse the site you agree to our policy on cookie usage.";
var closeBtnMsg = "Ok I comply";
var privacyBtnMsg = "Privacy Policy";
var privacyLink = "http://www.google.com";
//check cookies
if(document.cookie){
var cookieString = document.cookie;
var cookieList = cookieString.split(";");
// if cookie named OKCookie is found, return
for(x = 0; x < cookieList.length; x++){
if (cookieList[x].indexOf("OKCookie") != -1){return};
}
}
var docRoot = document.body;
var okC = document.createElement("div");
okC.setAttribute("id", "okCookie");
var okCp = document.createElement("p");
var okcText = document.createTextNode(msg);
//close button
var okCclose = document.createElement("a");
var okcCloseText = document.createTextNode(closeBtnMsg);
okCclose.setAttribute("href", "#");
okCclose.setAttribute("id", "okClose");
okCclose.appendChild(okcCloseText);
okCclose.addEventListener("click", closeCookie, false);
//privacy button
var okCprivacy = document.createElement("a");
var okcPrivacyText = document.createTextNode(privacyBtnMsg);
okCprivacy.setAttribute("href", privacyLink);
okCprivacy.setAttribute("id", "okCprivacy");
okCprivacy.appendChild(okcPrivacyText);
//add to DOM
okCp.appendChild(okcText);
okC.appendChild(okCp);
okC.appendChild(okCclose);
okC.appendChild(okCprivacy);
docRoot.appendChild(okC);
okC.classList.add("okcBeginAnimate");
function closeCookie(){
var cookieExpire = new Date();
cookieExpire.setFullYear(cookieExpire.getFullYear() +2);
document.cookie="OKCookie=1; expires=" + cookieExpire.toGMTString() + ";";
docRoot.removeChild(okC);
}
})();
</script>
<!-- Footer -->
<footer role="contentinfo">
<!-- Left Footer -->
<ul class="floatleft">
<li><a href="#header-anchor">HOME</a></li>
<li><a href="#services-anchor">SERVICES</a></li>
<li><a href="#team-anchor">OUR TEAM</a></li>
<li><a href="#about-anchor">ABOUT</a></li>
<li><a href="#contact-anchor">CONTACT</a></li>
</ul>
<!-- Right Footer -->
<ul class="floatright">
<p>Copyright 2014</p>
</ul>
</footer>
</body>
</html>
答案 0 :(得分：0)
您的页面声明是什么？可能是未完成<img />标记的错误。
<img src="img/banner.png" width="169" height="54" alt="Logo" />
标记<a>应该title="Title a"与alt="Alt img"图像
答案 1 :(得分：0)
标记<a class="anchor" id="header-anchor">没有结束标记。这会导致其后的元素被视为其内容，从而导致违反元素嵌套规则。最简单的解决方法是在开始标记之后立即添加结束标记：
<a class="anchor" id="header-anchor"></a>
但这样的元素并不是好的风格。您可以仅使用分配给具有真实内容的元素的id属性和class属性。
修复问题会导致报告文档中的某些错误，但它们相对容易分析（特别是在解释的帮助下）。