Monday, November 17, 2008

Tiles

Tiles have been used for background texture (think parchment paper), but they can also be used for CSS rollovers.

A simple CSS rollover using a 2px wide vertical tile:
#menuTop a{
padding:2px;
color:#000;
background-image:url('img/menuTile.jpg') repeat-x;
text-decoration:none;
}
#menuTop a:hover{
background-image:url('img/menuOverTile.jpg') repeat-x;
color:#cc0000;
}

And of course a tile can be used for a gradient effect in the page top:
#pgTop{
border-bottom:1px solid #cc0000;
background-image:url('img/pgTopTile.jpg');
}

No comments: