Is it possible to code multiple pseudos in one curly bracket in css?

Question

When styling links, using pseudos multiple times looks a bit ugly and time-consuming. Is this possible when styling links or are there any easier and good-looking ways than this? For example:

a:hover,:visited {
      ....
}

Answer 1

To keep things readable in CSS is similar to having a long line of code in any other programming language. I tend to rather break multiple CSS selectors into individual lines, so they're readable but still share the same style:

a:hover,
a:visited,
... {
    // your styles
}

but when doing the same in any CSS preprocessor i.e. SCSS, you could do this in other ways, but may not be any better than the above.

a {
    &:hover,
    &:visited {
        // basically even more verbose
    }
}

or maybe even:

$pseudos: 'hover', 'visited', 'active';
$each $p in $pseudos {
    a:{$p} {
        // same styles but overall even more verbose
    }
}

I would stick to the first one anyway. It's the most terse and readable of all unless of course there would be other styles related to general A element. In this case I'd use second notation, because the parent A style container would contain even more diverse A-related styles. This would be an example:

a {
    text-decoration: none;
    color: $default;

    &.pop-out:after {
        // just an example, which I'd rather solve using an icon font
        content: '';
        display: inline-block;
        width: 1em;
        height: 1em;
        background-image: url(popout-icon.png);
    }

    &:hover,
    &:visited {
        // pseudo specials go here.
    }
}