1.按鈕練習
<!DOCTYPE html>
<html>
<head>
<title>按鈕練習</title>
<meta charset="utf-8" />
<style type="text/css">
.cc{
display: block;
width: 161px;
height: 44px;
background-image: url(amazon-sprite_.png)
/*background-repeat: no-repeat;*/
}
.cc:active{
display: block;
width: 43px;
height: 31px;
background-image: url(amazon-sprite_.png);
/*background-repeat: no-repeat;*/
background-position: -58px -338px;
}
/*.cc:active{
background-image: url(timg3.jpg);
background-position: -400px 0px;
}*/
</style>
</head>
<body>
<a href="#" class="cc"></a>
</body>
</html>
2.給表格添加樣式
<!DOCTYPE html>
<html>
<head>
<title>給表格添加樣式</title>
<meta charset="utf-8" />
<style type="text/css">
table{
width: 694px;
height: 50px;
margin: 0 auto;
border-collapse: collapse;
}
td{
border: 1px solid gold;
text-align-last: center;
}
td:hover{
background-color: orange;
}
a{
font-size: 16px;
font-family: "微軟雅黑";
color: pink;
text-decoration: none;
}
a:hover{
color: red;
}
</style>
</head>
<body>
<table>
<tr>
<td><a href="#">首頁</a></td>
<td><a href="#">公司簡介</a></td>
<td><a href="#">解決方案</a></td>
<td><a href="#">公司新聞</a></td>
<td><a href="#">行業(yè)動態(tài)</a></td>
<td><a href="#">招賢納才</a></td>
<td><a href="#">聯(lián)系我們</a></td>
</tr>
</table>
</body>
</html>
最后編輯于 :
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者