資訊專欄INFORMATION COLUMN
摘要：今天看了好久寫了好久注釋都在代碼里直接上代碼了今天寫這個(gè)的時(shí)候意識(shí)到了變量的重要性在這里面下路導(dǎo)航的變量跟上邊含圖片的標(biāo)簽的變量分不清很難受以后不能這么寫關(guān)于輪播圖呢感覺(jué)思路還是要自己寫幾遍來(lái)的清晰不然怎么著都是白搭這是我隔了幾天寫出來(lái)的
今天看了好久 寫了好久 注釋都在代碼里 直接上代碼了
今天寫這個(gè)的時(shí)候 意識(shí)到了變量的重要性
在這里面下路導(dǎo)航的變量跟上邊含圖片的標(biāo)簽的變量分不清 很難受以后不能這么寫
關(guān)于輪播圖呢? 感覺(jué)思路還是要自己寫幾遍來(lái)的清晰? 不然怎么著都是白搭
這是我隔了幾天寫出來(lái)的兩種效果吧可能? 估計(jì)也算是大同小異
在這里貼出來(lái) 與大家共勉
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>輪播圖啊QAQtitle>
<style>
* {
margin: 0;
padding: 0;
}
.box {
width: 590px;
height: 470px;
margin: 100px auto;
border: 2px solid #ccc;
}
img {
vertical-align: top;
}
.inner {
width: 590px;
height: 470px;
position: relative;
overflow: hidden;
}
.inner ul {
width: 1000%;
position: absolute;
left: 0;
top: 0;
}
.inner li {
float: left;
list-style: none;
}
.indicators {
width: 1000%;
position: absolute;
left: 490px;
top: 452px;
}
.indicators ul {
width: 100px;
height: 18px;
background: rgba(0, 0, 0, 0.1);
line-height: 15px;
border-radius: 10px;
}
.indicators li {
float: left;
border-radius: 50%;
width: 15px;
height: 15px;
background-color: #fff;
text-align: center;
margin-right: 10px;
font-size: 10px;
cursor: pointer;
}
.indicators .current {
background-color: skyblue;
}
.hah {
position: relative;
left: 0;
top: 220px;
display: none;
}
.hah span {
display: block;
width: 30px;
height: 30px;
text-align: center;
color: #fff;
font-size: 20px;
cursor: pointer;
background: rgba(0, 0, 0, 0.3);
}
.left {
position: absolute;
left: 0;
}
.right {
position: absolute;
right: 0;
}
style>
head>
<body>
<div id="box" class="box">
<div class="inner" id="ph">
<ul>
<li><a href="#"><img src="11.jpg" alt="">a>li>
<li><a href="https://sale.jd.com/act/GirplhRxAm8z1.html"><img src="22.jpg" alt="">a>li>
<li><a href="#"><img src="33.jpg" alt="">a>li>
<li><a href="#"><img src="44.jpg" alt="">a>li>
最新活動(dòng)
