Back-Link
CODE
×
HTML
<div class='breadcrumb-navi container full v2'> <a class='back' href='#'>Overview Page</a> </div>
CSS
a.back { font-family: var(--body-font-boldstrong-1); font-style: var(--body-font-boldstrong-2); font-weight: var(--body-font-boldstrong-3); letter-spacing: var(--lls-1); word-spacing: var(--lls-2); text-transform: var(--btt); font-size: var(--fs-xxs); text-decoration:none; position:relative; color: var(--fc2); overflow:hidden; text-overflow:ellipsis; width: 100%; } a.back:hover, a.back:focus { color: var(--fsc1); } @media screen and (max-width: 575px) { a.back { font-size: var(--fs-xxxs); } } a.back { text-indent: 26px; display: inline-block; } a.back::before { background-image: url('data:image/svg+xml;utf8,
'); position: absolute; width: 16px; height: 16px; content: ''; left: 0; top: 52%; transform: translateY(-54%); background-size: contain; } a.back:hover::before { background-image: url('data:image/svg+xml;utf8,
'); } @media screen and (max-width: 575px) { a.back { text-indent: 23px; } a.back::before { width: 13px; height: 13px; } } a { color: var(--fc4); } a:hover, a:focus { color: var(--fsc1); } a { text-decoration-color: var(--fsc1); } a:hover { text-decoration-color: var(--fsc1); }
JS
Back-Link
Der CSS Code wird von dem der Breadcrumbs geerbt
Last Edit: Oct 24, 2023, 8:47pm
×
Overview Page