CSS: стиль и цвет внешних ссылок

Question

Я хочу оформить все внешние ссылки на моем сайте (Xenforo). Я пытаюсь с:

a[href ^= "http"]:after {
     content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=);    
}

выглядит хорошо, но мне нужно добавить красный цвет тоже. Как я могу это сделать?

Answer 1

Вы можете использовать тот же атрибут select, но элемент a красного цвета:

a[href ^= "http"] {
  color: red;
}

a[href ^= "http"]::after {
     content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=);    
}

<a href="/cats">Internal</a>

<a href="https://www.stackoverflow.com">Internal</a>