CSS Button : CSS Button « CSS Controls « HTML / CSS






CSS Button

 

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Button</title>
<style type="text/css">
body {
  font: 140%/1.6 "Gill Sans", Futura, "Lucida Grande", Geneva, sans-serif;
  color: #666;
  background: #fff;
}
a:link, a:visited {
  display: block;
  width: 6em;  /* dimensions needed for IE5.x/Win */
  padding: 0.2em;
  line-height: 1.4;
  background-color: #94B8E9;
  border: 1px solid black;
  color: #000;
  text-decoration: none;
  text-align: center;
}

a:hover {
 background-color: #369;
 color: #fff;
}
</style>
</head>

<body>

<p><a href="#">Join Today!</a></p>

</body>
</html>

   
  








Related examples in the same category

1.CSS Button with anchor
2.Shading Button
3.Read more and Comments buttons
4.Large Link button
5.Enlargable link button
6.Creating and assigning actions to buttons
7.Button navigation
8.A text button
9.Buttons
10.Buttons with button element
11.css rollover button
12.Using Image to create a Button
13.Button like right menu bar with mouse hover effect
14.Make anchor a button
15.Change input form button style