html-地域
原创
©著作权归作者所有：来自51CTO博客作者JackieDYH的原创作品，请联系作者获取转载授权，否则将追究法律责任
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>地域</title>
<style type="text/css">
dl {
padding: 0;
margin: 0;
clear: left;
}
dl dt {
float: left;
}
dt{
margin-right: 10px;
color: #6AD3D7;
line-height: 30px;
}
dd{
line-height: 30px;
}
dd a{
text-decoration: none;
color: #949494;
}
dd span{
color: #D8D7DE;
}
.col{
color: #FFA467;
}
</style>
</head>
<body>
<dl>
<dt>直辖市：</dt>
<dd>
<a href="javascript:;">北京</a> <span>|</span>
<a href="javascript:;" class="col">上海</a> <span>|</span>
<a href="javascript:;">天津</a> <span>|</span>
<a href="javascript:;">重庆</a>
</dd>
<dt>港澳台：</dt>
<dd>
<a href="javascript:;" class="col">香港</a> <span>|</span>
<a href="javascript:;">澳门</a> <span>|</span>
<a href="javascript:;">台湾</a> <span>|</span>
<a href="javascript:;">台北</a> <span>|</span>
<a href="javascript:;">高雄</a> <span>|</span>
<a href="javascript:;">花莲</a> <span>|</span>
<a href="javascript:;" class="col">垦丁</a> <span>|</span>
<a href="javascript:;">嘉义</a> <span>|</span>
<a href="javascript:;">南投</a> <span>|</span>
<a href="javascript:;">台南</a>
</dd>
<dt> 云南: </dt>
<dd>
<a href="javascript:;">丽江</a> <span>|</span>
<a href="javascript:;">昆明</a> <span>|</span>
<a href="javascript:;">大理</a> <span>|</span>
<a href="javascript:;" class="col">西双版纳</a> <span>|</span>
<a href="javascript:;">香格里拉</a> <span>|</span>
<a href="javascript:;">腾冲</a> <span>|</span>
<a href="javascript:;">梅里雪山</a> <span>|</span>
<a href="javascript:;" class="col">泸沽湖</a> <span>|</span>
<a href="javascript:;">双廊</a> <span>|</span>
<a href="javascript:;">玉龙雪山</a>
</dd>
</dl>
</body>
</html>
