CSS - Attribute and Negation Selectors

Negation selector: :not( )

If attribute contains a given string: *=  (Attributes such as Id, Class, Style, etc)

<style> /* Apply gold "dotted outline" to any elements inside body, except <li> tags */ body :not(li) {outline:5px dotted gold;} /* Apply Border to any Element in which its "Id" attribute contains "Apply" string */ [id*=Apply]{border:5px solid black;} /* Text color "yellow" to any Element in which its "Id" attribute does not contain "Apply" string */ Body *:not([id*=Apply]){color:yellow;} /* "Body *" must be used in order to work */ /* Orange background to any "div" element in which its "id" attribute contains "Apply" string */ div[id*=Apply] {background:orange !important;} /* Grey background to any "div" element in which its "id" attribute does not contain "Apply" string */ div:not([id*=Apply]) {background:grey !important;} /* Red background to any "p" element in which its "id" attribute contains "Apply" string */ p[id*=Apply] {background:Red !important;} /* Green background to any "p" element in which its "id" attribute does not contain "Apply" string */ p:not([id*=Apply]) {background:Green !important;} </style> <div id="1_Apply" style="background:red; width:50; height:50; float:left; margin:5px;"> Div </div> <div id="2_kjkkiApplyXffgg" style="background:green; width:50; height:50; float:left; margin:5px;"> Div </div> <div id="3_" style="background:blue; width:50; height:50; float:left; margin:5px;"> Div </div> <p id="4_Apply" style="clear:left;"> p1 </p> <p id="5_jhhApplyLkkjj"> p2 </p> <p id="6_"> p3 </p> <li id="7_ hhjjjApply"> Li </li>

*= CSS3 - chrome 4.0, Internet Explorer 7.0, Firefox 3.5, Safari 3.2, Opera 9.6
      (For this selector to work in IE8 and earlier, a <!DOCTYPE> must be declared.)

:not( ) CSS3 - chrome 4.0, Internet Explorer 9.0, Firefox 3.5, Safari 3.2, Opera 9.6


Keywords:
CSS - Attribute and Negation Selectors
CSS - Select any Element in which its "Id", "Class" or any other attribute contains or does not contain a given string