Dit is een inline link Om soortgelijke links op jouw pagina te plaatsen moet je in de tag die "om de <a></a> heenzit" de class inline_link toevoegen. Elke "<a>" die je een gradiënt achtergrond wilt geven, geef je de class in_line. Je moet ook onderstaande stylesheet in de head-sectie van jouw pagina plaatsen. Daaronder komt nog de html-voorbeeld-code van de "<h3> (met de link daarin) die op deze pagina is gebruikt.
<style type="text/css">
.inline_link a.in_line{display:inline-block;color:#eee;background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAiCAMAAADS3hSDAAAARVBMVEUyXgs2YAs5YQo9YgpAYwpCZApFZApJZglMZwlOaAlSaQlVaglZawlebAhibghlbwhucgdqcAhxcwd2dAd6dgd9dgeBeAavxZwhAAAAZklEQVRoge3QNQEDABDAwJSZwb/UWsgP3XISjm80PtHKGuAdjVe0sgZ4RitrgHs0HtHKGuAWrawBrtG4RCtrgHO0sgY4ReMYrawBDtHYR2MXjW20sgbYRGMdjVU0ltHKGmARjeQvfvcMxGh55FscAAAAAElFTkSuQmCC');text-decoration:none;text-align:center;padding-left:6px;padding-right:6px;padding-top:0;padding-bottom:0}
.inline_link a.in_line strong{display:inline-block;color:#eee;background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAiCAMAAADS3hSDAAAARVBMVEUyXgs2YAs5YQo9YgpAYwpCZApFZApJZglMZwlOaAlSaQlVaglZawlebAhibghlbwhucgdqcAhxcwd2dAd6dgd9dgeBeAavxZwhAAAAZklEQVRoge3QNQEDABDAwJSZwb/UWsgP3XISjm80PtHKGuAdjVe0sgZ4RitrgHs0HtHKGuAWrawBrtG4RCtrgHO0sgY4ReMYrawBDtHYR2MXjW20sgbYRGMdjVU0ltHKGmARjeQvfvcMxGh55FscAAAAAElFTkSuQmCC') right top;font-weight:normal;cursor:pointer;padding-left:5px;padding-right:10px;padding-top:0;padding-bottom:0}
.inline_link a.in_line:hover{ background-position:left bottom}
.inline_link a.in_line:hover strong{background-position:right bottom}
</style>
<h3 class="inline_link"><a href="http://kompoos.nl">home</a> » <a href="http://kompoos.nl/css/">css</a> » <a href="http://kompoos.nl/css/text-effects/">text-effects</a> » <a class="in_line" href="http://kompoos.nl/css/text-effects/inline-links.html">inline-links.html</a></h3>