<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>圖片特效展示</title>
<style?type?=css/text>
body,?ul,?li,?ol?{
list-style:?none;
padding:?0px;
margin:?0px;
font-size:?12px;
font-family:?微軟雅黑;
}
img?{
border:?0px;
}
.picList?{
width:?100%;
float:?left;
}
.picList?.pic1?{
width:?300px;
height:?200px;
position:?relative;
overflow:?hidden;
float:?left;
margin:?10px?0?0?10px;
}
.picList?.om?img,?.om?a?{
position:?absolute;
top:?0px;
left:?0px;
}
.picList?.om?img?{
width:?100%;
}
.picList?.om?a?{
display:?block;
width:?280px;
height:?180px;
top:?160px;
background:#000;
color:?white;
font-style:?normal;
line-height:?25px;
padding:?10px;
opacity:?0.8;
text-decoration:?none;
}
</style>
</head>
<body>
<div??class="picList"?id="picList">
<div?id="pic1"?class?="pic1"?>
<img?src="img/1.jpg"?alt="">
<a?href="#">附近可過(guò)生日<br>
放哪搜地高峰擊鼓hi土豪商品房
</a>
</div>
<div??class="om"?id="pic2">
<img?src="img/2.jpg"?alt="">
<a?href="#">圓角水晶按鈕制作<br>
網(wǎng)頁(yè)中圓角按鈕和狂堵按鈕制作就這么輕松
</a>
</div>
<div??class="om"?id="pic3">
<img?src="img/3.jpg"?alt="">
<a?href="#">導(dǎo)航條菜單制作<br>
30分鐘教會(huì)你制作各式各樣的導(dǎo)航條菜單
</a>
</div>
</div>
</body>
</html>問(wèn).picList.pic為什么不起作用?
添加回答
舉報(bào)
0/150
提交
取消