|
Színátmenet használata
2019.08.16. 10:57
Ebben a leírásban megmutatom nektek, milyen könnyen lehet színátmenetet beállítani egy-egy területre. (Szerintem linkelt felületen mutat a legjobban, pl: címkék, menüpontok, bővebben link, stb.)
A színátmeneteket a gradientmagic.com oldalán találjátok. Itt egyszerűen csak rá kell szűrni a kívánt színskálára, vagy színtmenet formára, és egyből ki tudod másolni a CSS kódot.
Ha kimásoltad, egy ilyen kódsort fogsz kapni:
linear-gradient(135deg, rgb(245, 177, 77),rgb(237, 53, 115));
Ezután egy már meglévő kódrészbe könnyedén be tudod illeszteni. Például itt egy általam használt függőleges menüstílus, aminél a background: részhez illesztettem be a kódot.
.oldalmodulmenu {
margin: 0 auto !important;
width: 100%;
text-align: center !important;
}
.oldalmodulmenu a:link, .oldalmodulmenu a:visited {
font-weight: bold;
font-family: arial;
font-size: 10px;
background: linear-gradient(90deg, rgb(223, 123, 141),rgb(188, 69, 32));
color: #ffffff;
text-transform: uppercase;
text-decoration: none;
width:90%;
display: inline-block;
border: 1px solid #000000;
margin: 1px;
}
.oldalmodulmenu a:hover, .oldalmodulmenu a:active {
background: #ffffff;
color: #000000;
border: 1px solid #000000;
text-decoration: none;
}
A színátmenetet be lehet illeszteni akár modulcímhez is, ekkor értelem szerűen a color: mögé kerül a kódsor. :)
|
AJÁNLOM AZ OLDALT
