The color of selected text can be easily changed by using the CSS | ::selection Selector. In the below code, we have used CSS ::selection on <h1> and <p> element and set its colour as yellow with green background.
Below example implements the above approach:
Example:
<!DOCTYPE html>
<html lang='en'>
<head>
<title>
How to change the color of selected text using CSS?
</title>
<style>
h1::selection {
background: yellow;
color: yellow;
}
p::selection {
background: red;
color: yellow;
}
</style>
</head>
<body>
<div class='geeks'>
<h1>This is heading</h1>
<p>
केसरी (केसरी का मतलब संस्कृत में शेर होता है)की स्थापना तिलक ने 1881 में की थी। केसरी एक महान प्रोजेक्टर और भारतीय राष्ट्रीय स्वतंत्रता आंदोलन का संदेशवाहक साबित हुआ। यह राजसी अखबार जो कई ज्वार-भाटे(उतार-चढ़ाव) को पार कर चुका है, अभी भी द डेली केसरी(The Daily Kesari) के नाम से चल रहा है। मराठा को भी तिलक द्वारा तत्कालीन राष्ट्र में प्रचलित विभिन्न स्थितियों को अपने लोगों के सामने उजागर करने के लिए शुरू किया था। पत्रिकाओं का मुख्य उद्देश्य लोगों के मन को स्व-शासन की आवश्यकता के लिए प्रेरित और प्रज्वलित करना था और उनके अधिकारों के लिए लड़ना था।
इन अखबारों को शुरू कराने में बहुत से लेखकों का योगदान रहा है जैसे - निबन्धमाला के लेखक विष्णुशास्त्री चिपलूनकर, लोकमान्य बाल गंगाधर तिलक और गोपाल गणेश अगरकर के साथ महादेव बल्लाल नामजोशी, वामन एस आप्टे और गणेश के. गर्दे आदि महान विभूतियों ने मिलकर यह समाचार पत्र की शुरुआत –
</p>
</div>
</body>
</html>