{"id":1848,"date":"2015-12-07T20:02:25","date_gmt":"2015-12-07T20:02:25","guid":{"rendered":"http:\/\/cssreset.com\/?p=1848"},"modified":"2015-12-07T20:02:25","modified_gmt":"2015-12-07T20:02:25","slug":"using-css3s-not-selector","status":"publish","type":"post","link":"https:\/\/cssdeck.com\/blog\/using-css3s-not-selector\/","title":{"rendered":"Using CSS3’s :not Selector"},"content":{"rendered":"

Have you ever wanted to select everything\u00a0except\u00a0<\/em>for a particular element or class of elements? You could manually write out all of the selectors in your CSS file, but depending on how intricate your HTML is, that could take forever. Luckily, CSS3’s pseudo-selector\u00a0:not()<\/strong>\u00a0will do the hard work for us.<\/p>\n

:not()\u00a0<\/strong>selects every element that isn’t the element you put within the parentheses. For example, if I had a page where I wanted all of the text except<\/em> for the <p><\/strong> tags to be blue, I could use the :not()<\/strong> selector to quickly select all of the HTML elements that aren’t p tags.<\/p>\n

\r\n\r\n\t\t
\r\n\r\n\t\t
\r\n\t\t\t\t\t\t< View plain text<\/span> ><\/a>\r\n\t\t\t\t\t<\/div>\r\n\r\n\t\t
css<\/div>\r\n\r\n\t\t\r\n\t\t
\r\n\r\n\t<\/div>\r\n\t\r\n\t
\r\n\t\t
  1. body :<\/span>not(<\/span>p)<\/span>{<\/span><\/div><\/li>\n
  2. color<\/span>:<\/span>\u00a0#0066ff<\/span>;<\/span><\/div><\/li>\n
  3. }<\/span><\/div><\/li>\n<\/ol>\t<\/div>\r\n\r\n<\/div>\r\n\n

    \"\"<\/p>\n

    It doesn’t get much easier than that. Play around with the :not()<\/strong> selector to see what other effects you can achieve!<\/p>\n

     <\/p>\n

    Share and Enjoy !<\/h3>
    0<\/span><\/span>Shares<\/small><\/div>
    <\/i>0<\/span><\/span><\/a><\/span>\n<\/i><\/a><\/span>\n<\/i><\/a><\/span>\n<\/i>0<\/span><\/span><\/a><\/span>\n<\/i><\/a><\/span>\n<\/i><\/a><\/span><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"

    Have you ever wanted to select everything\u00a0except\u00a0for a particular element or class of elements? You could manually write out all of the selectors in your CSS file, but depending on how intricate your HTML is, that could take forever. Luckily, […]<\/p>\n

    Read Article<\/a><\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/posts\/1848"}],"collection":[{"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/comments?post=1848"}],"version-history":[{"count":1,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/posts\/1848\/revisions"}],"predecessor-version":[{"id":1849,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/posts\/1848\/revisions\/1849"}],"wp:attachment":[{"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/media?parent=1848"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/categories?post=1848"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cssdeck.com\/blog\/wp-json\/wp\/v2\/tags?post=1848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}