Auch in Website kann man, wie im echten Leben, wichtige Passagen 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: #f1e740; background: rgb(241, 231, 64); background: hsl(57, 86%, 60%);
}
.markBlue{
background: #3aafdc; background: rgb(58, 175, 220); background: hsl(197, 70%, 55%);
}
.markGreen{
background: #2ba727; background: rgb(43, 167, 39); background: hsl(118, 62%, 40%);
}
.markRed{
background: #e94f58; background: rgb(233, 79, 88); background: hsl(356, 78%, 61%);
}
.markTurquoise{
background: #009e6c; background: rgb(0, 158, 108); background: hsl(161, 100%, 31%);
}
.markOrange{
background: #f39539; background: rgb(243, 149, 57); background: hsl(30, 89%, 59%);
}
.markLavender{
background: #85569c; background: rgb(133, 86, 156); background: hsl(280, 29%, 47%);
}
.markPink{
background: #ea5a79; background: rgb(234, 90, 121); background: hsl(347, 77%, 64%);
}
.markLilac{
background: #d72e83; background: rgb(215, 46, 131); background: hsl(330, 68%, 51%);
}
markYellow |
markBlue |
markGreen |
markRed |
markTurquoise |
markOrange |
markLavender |
markPink |
markLilac |
Textmarker ORIGINAL-Pastel-Farben
.markTouchOfTurquoise{
background: #a1d4cf; background: rgb(161, 212, 207); background: hsl(174, 37%, 73%);
}
.markHintOfMint{
background: #90cbaa; background: rgb(144, 203, 170); background: hsl(146, 36%, 68%);
}
.markCreamyPeach{
background: #f4a384; background: rgb(244, 163, 132); background: hsl(17, 84%, 74%);
}
.markPinkBlush{
background: #f4acb6; background: rgb(244, 172, 182); background: hsl(352, 77%, 82%);
}
.markMilkyYellow{
background: #f8dd74; background: rgb(248, 221, 116); background: hsl(48, 90%, 71%);
}
.markLilacHaze{
background: #d5b6d4; background: rgb(213, 182, 212); background: hsl(302, 27%, 77%);
}
.markCloudyBlue{
background: #b5c9df; background: rgb(181, 201, 223); background: hsl(211, 40%, 79%);
}
.markDashOfLime{
background: #dff18f; background: rgb(223, 241, 143); background: hsl(71, 78%, 75%);
}
.markMellowCoralRed{
background: #fa7656; background: rgb(250, 118, 86); background: hsl(12, 94%, 66%);
}
.markCherryBlossomPink{
background: #fe7d8f; background: rgb(254, 125, 143); background: hsl(352, 98%, 74%);
}
markTouchOfTurquoise |
markHintOfMint |
markCreamyPeach |
markPinkBlush |
markMilkyYellow |
markLilacHaze |
markCloudyBlue |
markDashOfLime |
markMellowCoralRed |
markCherryBlossomPink |
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/