:any-link

:any-link lets you to use the proposed :any-link pseudo-class in CSS.

:any-link simplifies selectors targeting links, as the naming of :link is misleading; it specifically means unvisited links only, rather than all links.

/* before */

nav :any-link > span {
    background-color: yellow;
}

/* after */

nav :link > span,
nav :visited > span {
    background-color: yellow;
}

From the proposal:

The :any-link pseudo-class represents an element that acts as the source anchor of a hyperlink. It matches an element if the element would match :link or :visited.

Options

prefix (string): prepends a prefix (surrounded by dashes) to the pseudo-class, preventing any clash with native syntax.

{
    prefix: 'foo' // pseudo-class becomes :-foo-any-link
}

Usage

Add :any-link to your build tool:

npm install :any-link --save-dev

Node

require(':any-link').process(YOUR_CSS, { /* options */ });

PostCSS

Add PostCSS to your build tool:

npm install postcss --save-dev

Load :any-link as a PostCSS plugin:

postcss([
    require(':any-link')({ /* options */ })
]).process(YOUR_CSS, /* options */);

Gulp

Add Gulp PostCSS to your build tool:

npm install gulp-postcss --save-dev

Enable :any-link within your Gulpfile:

var postcss = require('gulp-postcss');

gulp.task('css', function () {
    return gulp.src('./src/*.css').pipe(
        postcss([
            require(':any-link')({ /* options */ })
        ])
    ).pipe(
        gulp.dest('.')
    );
});

Grunt

Add Grunt PostCSS to your build tool:

npm install grunt-postcss --save-dev

Enable :any-link within your Gruntfile:

grunt.loadNpmTasks('grunt-postcss');

grunt.initConfig({
    postcss: {
        options: {
            use: [
                require(':any-link')({ /* options */ })
            ]
        },
        dist: {
            src: '*.css'
        }
    }
});

Alternatives

Here are a few other ways to simulate the effect of [PostCSS Pseudo-Class Any-Link].

/* Use @custom-selector; supported nowhere yet */

@custom-selector :--any-link :link, :visited;

:--any-link { /* ... */ }

/* Use :matches; supported in Firefox 4+, Chrome 12+, Opera 15+, Safari 5.1+ */

:matches(:link, :visited) { /* ... */ }

/* Use :link and :visited; supported everywhere */

:link, :visited { /* ... */ }