@charset "utf-8";
/* @功能:重设浏览器默认样式 */
/* 防止用户自定义背景颜色对网页的影响,添加让用户可以自定义字体 */
html {
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
}
/* 内外边距通常让各个浏览器样式的表现位置不同 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
margin:0;
padding:0;
}
/* 重设 HTML5 标签,IE 需要在 js 中 createElement(TAG) */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
display:block;
}
/* HTML5 媒体文件跟 img 保持一致 */
audio,canvas,video {
display:inline-block;
*display:inline;
*zoom:1;
}
/* 要注意表单元素并不继承父级 font 的问题 */
body,button,input,select,textarea {
font:12px/1.5 "微软雅黑";
}
input,select,textarea {
font-size:100%;
}
/* 去掉各Table cell 的边距并让其边重合 */
table {
border-collapse:collapse;
border-spacing:0;
}
/* IE bug fixed:th 不继承 text-align*/
th {
text-align:inherit;
}
/* 去除默认边框 */
fieldset,img {
border:0;
}
/* ie6 7 8(q) bug 显示为行内表现 */ {
display:block;
}
/* 去掉 firefox 下此元素的边框 */
abbr,acronym {
border:0;
font-variant:normal;
}
/* 一致的 del 样式 */
del {
text-decoration:line-through;
}
address,caption,cite,code,dfn,em,th,var {
font-style:normal;
font-weight:500;
}
/* 去掉列表前的标识,li 会继承 */
ol,ul {
list-style:none;
}
/* 对齐是排版最重要的因素,别让什么都居中 */
caption,th {
text-align:left;
}
/* 来自yahoo,让标题都自定义,适应多个系统应用 */
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:500;
}
q:before,q:after {
content:'';
}
/* 统一上标和下标 */
sub,sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}
sup {
top:-0.5em;
}
sub {
bottom:-0.25em;
}
/* 让链接在 hover 状态下显示下划线 */
a:hover {
text-decoration:underline;
}
/* 默认不显示下划线,保持页面简洁 */
ins,a {
text-decoration:none;
}
/* 清理浮动 */
.fn-clear:after {
visibility:hidden;
display:block;
font-size:0;
content:" ";
clear:both;
height:0;
}
.fn-clear {
zoom:1;
/* for IE6 IE7 */
}
#box29Main {
width:800px;
height:234px;
margin:0 auto;
position:relative;
}
#box29Main li {
position:absolute;
left:200px;
top:0;
}
#box29Main li img {
width:100%;
height:100%;
}
#box29Main .box29-clt {
opacity:0;
}
#box29Main .box29-clt-prev {
position:absolute;
top:50%;
left:20px;
margin-top:-36px;
width:72px;
height:72px;
line-height:72px;
cursor:pointer;
font-size:70px;
color:#80848f;
text-align:center;
z-index:10;
}
#box29Main .box29-clt-next {
position:absolute;
top:50%;
right:20px;
margin-top:-36px;
width:72px;
height:72px;
line-height:72px;
font-size:70px;
color:#80848f;
text-align:center;
cursor:pointer;
z-index:10;
}
1、获取需要的标签
2、鼠标移入盒子显示左右箭头
3、利用数组方法完成左右切换