如何使用css访问<li>链接

Question

I have a small gallery written in PHP, showing images from a directory (webcam pictures).

This is the line where the images shows up in index.php:

<ul id="galleryList" class="clearfix">

            <?php foreach ($galleryArray['images'] as $image): ?>

                <li><a href="<?php echo html_entity_decode($image['file_path']); ?>" rel="colorbox"><img src="<?php echo $image['thumb_path']; ?>" alt="<?php echo $image['file_title']; ?>"/></a></li>
            <?php endforeach; ?>
        </ul>

The hover works fine; now would like to have a black background shown on visited images, with this code:

    #galleryList {
    margin: 0;
    padding: 0 4px;
}

#galleryList li {
    display: inline-block;
    float: left;
    list-style: none;
    margin: 5px 6px;
    padding: 0;
}

#galleryList li a {
    background-color: #DF0101 !important;
    border-top: 1px solid #DF0101;
    border-left: 1px solid #DF0101;
    border-right: 1px solid #DF0101;
    border-bottom: 1px solid #DF0101;
    display: block;
    padding: 4px;
    margin-bottom: 30px;
}

#galleryList li a:hover{
    background-color: #fff !important;

}

#galleryList li a:visited {
        background-color: #000 !important;


}

But it just wont work; what am I doing wrong?

Answer 1

Change this:

#galleryList li a:visited {
    background-color: #000 !important;
}

to this:

#galleryList li a:visited:hover {
    background-color: #000 !important;
}