Custom link styles can be used on elements that need a different visual treatment to links within content areas, for example author links.
Usage
Use .link
, .link-implied
or .link-article
to apply custom styling to links.
<a href="#">This is a standard link</a>
<a class="link" href="#">This is a link using <code>.link</code></a>
<a class="link-implied" href="#">This is a link using <code>.link-implied</code></a>
<a class="link-article" href="#">This is a link using <code>.link-article</code></a>
Use .link-stretched
to make a link’s containing block clickable. In most cases, this means that an element with position: relative;
that contains a link with the .link-stretched
class is clickable.
<div class="card">
<div class="card-body">
<h3 class="h2">
This is a card title
</h3>
<p>
This is some card content containing a <a class="link-stretched" href="#">stretched link</a> which makes the entire card clickable!
</p>
</div>
</div>