|
Linkek testreszabása
2018.12.07. 17:17
Néhány szuper kód segítségével lehetőségünk van még izgalmasabbá és szebbé tenni a linkeket.
Természetesen ehhez is tartozik egy alap kód, mellyel be tudjuk állítani a linkek kinézetét:
a:link, a:visited {
font-family: 'Noto Serif JP', sans-serif; (BETŰTÍPUS)
font-style: italic; (FÉLKÖVÉR, DŐLT)
background-color: transparent; (HÁTTÉRSZÍN)
color: #000000; (BETŰSZÍN)
text-decoration: none !important;
transition:0.5s ease; (HALVÁNYÍTÁS MÉRTÉKE, NE BÁNTSD)
-o-transition:0.5s ease;
-moz-transition:0.5s ease;
-webkit-transition:0.5s ease;
}
a:hover, a:active { (MIKOR RÁVISZED AZ EGERET)
background-color: transparent;
color: #d2d2d2;
text-decoration: none !important;
}
Ehhez kiegészítésképp hozzá tudunk rakni egy-két kiegészítő kódot:
a {
position: relative;
display: inline-block;
text-decoration: none;
}
a::after {
position: absolute;
bottom: -4px;
left: 0;
content: '';
width: 100%;
height: 2px;
background: #333;
transform: scale(0, 1);
transform-origin: left top;
transition: transform .3s;
}
a:hover::after {
transform: scale(1, 1);
}
| 
AJÁNLOM AZ OLDALT
