สุดท้ายก็ลงตัวอันนี้ครับ
ได้ทั้งแบบฝัง css และไม่ฝัง css
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<title>ตัวอย่าง</title>
<style type="text/css">
<!--
a.button {
font-weight: bold;
font-size: 9px;
padding: 6px 10px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background:#D6FBFE;
}
a.button2 {
font-weight: bold;
font-size: 9px;
padding: 6px 10px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background:#D6F3FE;
}
a.button:hover {
background-color:#FFCC66;
color: red;
border-color: black white white black;
text-decoration: none;
}
a.button2:hover {
background-color:#FFCCCC;
color: red;
border-color: black white white black;
text-decoration: none;
}
</style>
</head>
<!--
a.button {
font-weight: bold;
font-size: 9px;
padding: 6px 10px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background:#D6FBFE;
}
a.button2 {
font-weight: bold;
font-size: 9px;
padding: 6px 10px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background:#D6F3FE;
}
a.button:hover {
background-color:#FFCC66;
color: red;
border-color: black white white black;
text-decoration: none;
}
a.button2:hover {
background-color:#FFCCCC;
color: red;
border-color: black white white black;
text-decoration: none;
}
</style>
</head>
<body>
<p align="center"><a st style="font-weight: bold;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 4px 8px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background: #A4F9FF
"
href="index.php">OK</a>
</p>
<p align="center">
<a class="button2" href="0.html">|<</a>
<a class="button" href="1.html">1</a>
<a class="button" href="2.html">2</a>
<a class="button" href="3.html">3</a>
<a class="button2" href="4.html">>|</a>
</p>
</body>
</html>
ได้ดังตัวอย่างครับ<p align="center"><a st style="font-weight: bold;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 4px 8px;
border-top: 1px solid white;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid white;
text-align: center;
min-width: 75px;
text-transform: uppercase;
background: #A4F9FF
"
href="index.php">OK</a>
</p>
<p align="center">
<a class="button2" href="0.html">|<</a>
<a class="button" href="1.html">1</a>
<a class="button" href="2.html">2</a>
<a class="button" href="3.html">3</a>
<a class="button2" href="4.html">>|</a>
</p>
</body>
</html>
ไม่มีความคิดเห็น:
แสดงความคิดเห็น