How do I apply anchor psuedo classes (a:hover, etc.) to element links in a data repeater

Question

I do a table on my page with site.com.
My table has 2 columns. I want can click on my data (so i want my data in columns will be a link). I do it. But now i want to customize my link. i can't do it.
I know a:link a:hover a:visited.... but when I use it, nothing change in my screen.

My table is doing with "custom code" and data repeater for have acces to my object.

My code where i change the color of the link. But i want change a:hover too...
<>a href="#" style="color:black;" <{!Cluster__r.Name} >/a<

Thanks for your answers.

Answer 1

In my instructions I use a CSS class called fancy-link, but you can use whatever class name you want.

1. Set the class property of the data element under the Style tab.
   

2. It will tell you that the Style doesn't exist in any style sheet and Would you like to create it. You don't have to do that, since you'll be using the pseudo classes.

3. Go out of the page and back to the site overview and bring up the SiteStyleSheet (or your appropriate style sheet).

4. On the Action menu for the SiteStyleSheet (in the navigation/tree panel) select Create a New Style Sheet Item.

5. Type .fancy-link a:hover. This will create a style sheet item that you can edit.
   

6. Repeat step's 4 and 5 with the other anchor pseudo classes (a:link, a:visted, etc.).

Some other points:

• If you need to you can use a different CSS selector other than class. For example, you could specify the ID and then use that in the style sheet item.
• You can also just manually edit the CSS instead of using the GUI to create the style sheet items, by clicking the Edit Style Sheet Code button on the Style Sheet's page.