Auch in Website kann man, wie im echten Leben, wichtige Passagen farblich markieren bzw. hervorheben.
Für diesen Fall gibt es das HTML Mark Text-Element '<mark>
'.
Es gibt per Browser-Default eine Farbe welche den Hintergrund farbig hinterlegt.
Diesen Farbwert kann man global per CSS einmalig für die Website definieren:
::-moz-selection{
background: #______;
}
::selection{
background: #______;
}
Mit entsprechender CSS-Klasse kann man auch individuell Farben einsetzen.
Warum nicht LifeLike-Farben von STABILO BOSS® im Webdesign verwenden?
Textmarker ORIGINAL-Farben
.markYellow{
background: #fce900; background: rgb(252,233,0); background: hsl(55.5,100%,49.4%);
}
.markBlue{
background: #3ec0f0; background: rgb(62,192,240); background: hsl(196.2,85.6%,59.2%);
}
.markGreen{
background: #85bd3f; background: rgb(133,189,63); background: hsl(86.7,50%,49.4%);
}
.markRed{
background: #f18794; background: rgb(241,135,148); background: hsl(352.6,79.1%,73.7%);
}
.markTurquoise{
background: #009bb4; background: rgb(0,155,180); background: hsl(188.3,100%,35.3%);
}
.markOrange{
background: #ea5725; background: rgb(234,87,37); background: hsl(15.2,82.4%,53.1%);
}
.markLavender{
background: #9d74b1; background: rgb(157,116,177); background: hsl(280.3,28.1%,57.5%);
}
.markPink{
background: #ed6ea7; background: rgb(237,110,167); background: hsl(333.1,77.9%,68%);
}
.markLilac{
background: #9a35b5; background: rgb(154,53,181); background: hsl(287.3,54.7%,45.9%);
}
markYellow
markBlue
markGreen
markRed
markTurquoise
markOrange
markLavender
markPink
markLilac
Textmarker ORIGINAL-Pastel-Farben
.markTouchOfTurquoise{
background: #81cac6; background: rgb(129,202,198); background: hsl(176.7,40.8%,64.9%);
}
.markHintOfMint{
background: #a9d5b5; background: rgb(169,213,181); background: hsl(136.4,34.4%,74.9%);
}
.markPaleOrange{
background: #f0bb82; background: rgb(240,187,130); background: hsl(31.1,78.6%,72.5%);
}
.markCreamyPeach{
background: #f49e84; background: rgb(244,158,132); background: hsl(13.9,83.6%,73.7%);
}
.markPinkBlush{
background: #f5aebb; background: rgb(245,174,187); background: hsl(349,78%,82.2%);
}
.markMilkyYellow{
background: #f5efa1; background: rgb(245,239,161); background: hsl(55.7,80.8%,79.6%);
}
.markFrozenFuchsia{
background: #e5a0dc; background: rgb(229,160,220); background: hsl(307.8,57%,76.3%);
}
.markBreezyBlue{
background: #a1d3ea; background: rgb(161,211,234); background: hsl(198.9,63.5%,77.5%);
}
.markCloudyBlue{
background: #b2e0f7; background: rgb(178,224,247); background: hsl(200,81.2%,83.3%);
}
.markDashOfLime{
background: #ccff99; background: rgb(204,255,153); background: hsl(90,100%,80%);
}
.markMellowCoralRed{
background: #ff6666; background: rgb(255,102,102); background: hsl(0,100%,70%);
}
.markCherryBlossomPink{
background: #ff9999; background: rgb(255,153,153); background: hsl(0,100%,80%);
}
.markPastelDustyGrey{
background: #bcc6c7; background: rgb(188,198,199); background: hsl(185.5,8.9%,75.9%);
}
markTouchOfTurquoise
markHintOfMint
markPaleOrange
markCreamyPeach
markPinkBlush
markMilkyYellow
markFrozenFuchsia
markBreezyBlue
markCloudyBlue
markDashOfLime
markMellowCoralRed
markCherryBlossomPink
markPastelDustyGrey
source:
- //www.stabilo.com/de/shop/59/textmarker-stabilo-boss-original/kaufen
- //www.stabilo.com/de/shop/185/textmarker-stabilo-boss-original-pastel/kaufen
- //www.stabilo.com/com/products/highlighting/highlighters/stabilo-boss-original/
- //www.stabilo.com/com/products/highlighting/highlighters/stabilo-boss-original-pastel/