Checked Elements with :check

Radio buttons and check boxes that are checkable can be selected through the :checked selector. You can combine :checked with the negation selector to select unchecked elements.

 
<!DOCTYPE HTML> 
<html> 
    <head> 
        <title>Example</title> 
        <style> 
        :checked + span { 
            background-color: red; 
            color: white; 
            border: medium solid black; 
        } 
        </style> 
    </head> 
    <body> 
        <form method="post" action="http://yourServer/form"> 
            <input type="checkbox" id="myID" name="myName"/> 
        </form> 
    </body> 
</html>
  
Click to view the demo
Home 
  HTML CSS Book 
    CSS  

Pseudo Selectors:
  1. ::first-line Selector
  2. ::first-letter Selector
  3. :before Selector
  4. :after Selector
  5. CSS Counter Feature
  6. :root Selector
  7. Child Selectors
  8. :first-child Selector
  9. :last-child Selector
  10. :only-child Selector
  11. :only-of-type selector
  12. :nth-child(n)
  13. :nth-last-child(n)
  14. :nth-of-type(n)
  15. :nth-last-of-type(n)
  16. Enabled Elements with :enabled
  17. Disabled Elements with :disabled
  18. Checked Elements with :check
  19. Default Elements with :default
  20. Valid Elements with :valid
  21. Invalid input Elements with :invalid
  22. :in-range selector
  23. :out-of-range selector
  24. :required selector
  25. :optional selector
  26. :link selector matches hyperlinks.
  27. :visited selector matches visited hyperlinks.
  28. :hover Selector
  29. :active Selector
  30. :focus Selector
  31. Negation Selector not
  32. :empty Selector
  33. :lang Selector
  34. :target Selector
Related: