div+css處理連結的 link visited hover active四種狀態
阿新 • • 發佈:2018-12-21
div+css處理連結的:link,:visited,:hover,:active四種狀態
[示例程式碼]
<html>
<head>
<style>
a:link {background-color: red; color: white;}
a:visited {background-color: yellow; color: black;}
a:hover {background-color: green; color: white;}
a:active {background-color: blue; color: white;}
</style>
</head>
<body>
<div>
<a href="http://a.link/">
連結的預設效果是a:link中的效果
</a>
</div>
<div>
<a href="">
訪問過的連結的效果是a:visited中的效果
</a>
</div>
<div>
<a href="http://blog.csdn.net/hu_zhenghui">
滑鼠移動到連結上的效果是a:hover中的效果
</a>
</div>
<div>
<a href="http://blog.csdn.net/hu_zhenghui">
滑鼠單擊連結時的效果是a:active中的效果
</a>
</div>
</body>
</html>
[div+css關鍵詞]
div css[div+css重要工具]
[div+css的常見問題]
較驗div+css格式,http://validator.w3.org/div+css的margin縮寫方式
div+css的padding縮寫方式
連結的:link,:visited,:hover,:active四種狀態
[div+css的瀏覽器相容問題]
水平居中,Firefox使用margin-left: auto; margin-right: auto; IE6 使用text-align: center;垂直居中,Firefox中使用display: table-cell; vertical-align: middle;可以實現div垂直居中,而IE6中則需要藉助IE6中css的特點實現垂直居中。
!important標記,Firefox支援!important標記,IE6忽略!important標記
手形滑鼠指標,使用cursor: pointer;