HTML文件
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" href="css/untitled.css">
</head>
<body>
<div class="main" id="main">
<!--图片-->
<div class="banner">
<a>
<div class="slide slide_1"></div>
</a>
<a>
<div class="slide slide_2"></div>
</a>
<a>
<div class="slide slide_3"></div>
</a>
</div>
<!--上一张、下一张-->
<a href="javascriptviod(0)" class="button prev"></a>
<a href="javascriptviod(0)" class="button next"></a>
<!--圆点-->
<div class="dots">
<span class="active"></span>
<span></span>
<span></span>
</div>
</div>
<script src="js/Untitled.js" ></script>
</body>
</html>
CSS文件
@charset "utf-8";
/* CSS Document */
*{
margin: 0;
padding: 0;
}
ul{
list-style: none;
}
body{
color: #14191E;
font-family: "微软雅黑"
}
/*公用*/
.main{
width: 1200px;
height: 460px;
overflow: hidden;
margin: 30px auto;
position: relative;
}
.banner{
width: 1200px;
height: 460px;
overflow: hidden;
position: relative;
}
.slide{
width: 1200px;
height: 460px;
position: absolute;
}
.slide_1{
background-image:url(../img/slide_1.jpg)
}
.slide_2{
background-image: url(../img/slide_2.jpg)
}
.slide_3{
background-image: url(../img/slide_3.jpg)
}
/*按钮*/
.button{
width: 40px;
height: 80px;
position: absolute;
top: 50%;
margin-top: -40px;
left: 244px;
background:url(../img/button.png) no-repeat center center
}
.next{
left: auto;
right: 20px;
transform: rotate(180deg)
}
.button:hover{
background-color:#999;
opacity: 0.8
}
/*圆点*/
.dots{
position: absolute;
right: 20px;
bottom: 24px;
text-align: right;
}
.dots span{
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
background: rgba(7,17,27,0.4);
box-shadow: 0 0 0 2px rgba(255,255,255,0.8) inset;
margin-left: 8px;
line-height: 12px;
}
.dots span.active{
background: #fff;
box-shadow: 0 0 0 2px rgba(7,17,27,0.4) inset;
}
JS文件不知道问啥,写个functiong byId(id){} 它前面的序号就红了
主要问题是:控制台老是显示下面的内容:
控制台提示 XML5619: 文档语法不正确。行: 1,列 1
咋回事?
慕设计2395807
相关分类