CSS हमें लिंक्स को कलर करने की अनुमति देता है। color प्रॉपर्टी का उपयोग किसी एलिमेंट में टेक्स्ट का कलर सेट करने के लिए किया जाता है।
pseudo selectors का क्रम निम्न है: :link, :visited, :hover, :active।
सिंटैक्स
CSS color प्रॉपर्टी का सिंटैक्स निम्नलिखित है:
Selector { color: /*value*/ }उदाहरण
निम्नलिखित उदाहरण CSS color प्रॉपर्टी को दर्शाते हैं:
<!DOCTYPE html> <html> <head> <style> #demo::after { content: " (visited) "; font-style: italic; } a:link { color: lime; } a:visited { color: green; } a:hover { color: orange; } a:active { color: gold; } </style> </head> <body> <h2>Demo Links</h2> <a id="demo" href="">This is demo text 1.</a> <hr> <p> <a href="#">This is demo text 2.</a> </p> </body> </html>आउटपुट
यह निम्नलिखित आउटपुट देता है:
दूसरे लिंक पर होवर करने पर, हमें निम्नलिखित आउटपुट मिलता है:
दूसरे लिंक पर क्लिक करने पर, हमें निम्नलिखित आउटपुट मिलता है:
उदाहरण
<!DOCTYPE html> <html> <head> <style> div { margin: auto; font-size: 1.4em; background-color: lightseagreen; width: 100px; text-align: center; } a:link { color: rebeccapurple; } </style> </head> <body> <div> <a id="demo" href="">Demo link.</a> </div> </body> </html>आउटपुट
यह निम्नलिखित आउटपुट देता है:
