Colored links
Colored links with hover states
Example
You can use the .link-* classes to colorize links. Unlike the .text-* classes, these classes have a :hover and :focus state.
Primary link
Secondary link
Success link
Danger link
Warning link
Info link
Light link
Dark link
Emphasis link
<a class="link link-hover link-primary block" href="#!">Primary link</a>
<a class="link link-hover link-secondary block" href="#!">Secondary link</a>
<a class="link link-hover link-success block" href="#!">Success link</a>
<a class="link link-hover link-danger block" href="#!">Danger link</a>
<a class="link link-hover link-warning block" href="#!">Warning link</a>
<a class="link link-hover link-info block" href="#!">Info link</a>
<a class="link link-hover text-white block" href="#!">Light link</a>
<a class="link link-hover text-black block" href="#!">Dark link</a>
<a class="link link-hover text-emphasis block" href="#!">Emphasis link</a>Link utilities
Primary link
Secondary link
Success link
Danger link
Warning link
Info link
Light link
Dark link
Emphasis link
<a class="link link-hover link-primary underline-offset-4 block" href="#!">Primary link</a>
<a class="link link-hover link-secondary underline-offset-4 block" href="#!">Secondary link</a>
<a class="link link-hover link-success underline-offset-4 block" href="#!">Success link</a>
<a class="link link-hover link-danger underline-offset-4 block" href="#!">Danger link</a>
<a class="link link-hover link-warning underline-offset-4 block" href="#!">Warning link</a>
<a class="link link-hover link-info underline-offset-4 block" href="#!">Info link</a>
<a class="link link-hover text-white underline-offset-4 block" href="#!">Light link</a>
<a class="link link-hover text-black underline-offset-4 block" href="#!">Dark link</a>
<a class="link link-hover text-emphasis underline-offset-4 block" href="#!">Emphasis link</a>
