<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
>
< html xmlns ="http://www.w3.org/1999/xhtml" xml:lang ="zh" lang ="zh" >
< head profile ="http://www.w3.org/2000/08/w3c-synd/#" >
< meta http-equiv ="content-language" content ="zh-cn" />
< meta http-equiv ="content-type" content ="text/html;charset=gb2312" />
< style > ...
dl {...}{
position:absolute;
width:240px;
height:170px;
border:10px solid #eee;
}
dd {...}{
margin:0;
width:240px;
height:170px;
overflow:hidden;
}
img {...}{
border:1px solid black
}
dt {...}{
position:absolute;
right:3px;
top:50px;
}
a {...}{
display:block;
margin:1px;
width:20px;
height:20px;
text-align:center;
font:700 12px/20px "宋体",sans-serif;
color:#fff;
text-decoration:none;
background:#666;
border:1px solid #fff;
filter:alpha(opacity=40);
opacity:.4;
}
a:hover {...}{
background:#000
}
</ style >
</ head >
< body >
< dl >
< dt >< a href ="#a" title ="" > 1 </ a >< a href ="#b" title ="" > 2 </ a >< a href ="#c" title ="" > 3 </ a ></ dt >
< dd >
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/1.jpg" alt ="" title ="" id ="a" />
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/2.jpg" alt ="" title ="" id ="b" />
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/3.jpg" alt ="" title ="" id ="c" />
</ dd >
</ dl >
</ body >
</ html >
< html xmlns ="http://www.w3.org/1999/xhtml" xml:lang ="zh" lang ="zh" >
< head profile ="http://www.w3.org/2000/08/w3c-synd/#" >
< meta http-equiv ="content-language" content ="zh-cn" />
< meta http-equiv ="content-type" content ="text/html;charset=gb2312" />
< style > ...
dl {...}{
position:absolute;
width:240px;
height:170px;
border:10px solid #eee;
}
dd {...}{
margin:0;
width:240px;
height:170px;
overflow:hidden;
}
img {...}{
border:1px solid black
}
dt {...}{
position:absolute;
right:3px;
top:50px;
}
a {...}{
display:block;
margin:1px;
width:20px;
height:20px;
text-align:center;
font:700 12px/20px "宋体",sans-serif;
color:#fff;
text-decoration:none;
background:#666;
border:1px solid #fff;
filter:alpha(opacity=40);
opacity:.4;
}
a:hover {...}{
background:#000
}
</ style >
</ head >
< body >
< dl >
< dt >< a href ="#a" title ="" > 1 </ a >< a href ="#b" title ="" > 2 </ a >< a href ="#c" title ="" > 3 </ a ></ dt >
< dd >
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/1.jpg" alt ="" title ="" id ="a" />
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/2.jpg" alt ="" title ="" id ="b" />
< img src ="http://www.blueidea.com/articleimg/2007/03/4549/3.jpg" alt ="" title ="" id ="c" />
</ dd >
</ dl >
</ body >
</ html >