Copy paste list of CSS snippets
May 15th, 2007 | Posted in CSS, Development | 1 Comments
List of CSS snippets, in no particular order. Naturally, most if not all will not work in IE6. I plan to add this list as and when.
CSS
-
/* Selects all p tags that are the children of div elements */
-
div > p
-
-
-
/* Selects the next immediate sibling to the first one */
-
p + p {text-transform: uppercase;}
-
<p>i am all lowercase</p>
-
<p>i am all uppercase</p>
-
-
-
/* Sets elements with non-standard attributes */
-
p[makemered]{color:#ff0000;}
-
<p makemered="">i am red</p>
-
-
-
/* Attribute value matching */
-
a[href^="http://"]:not([href*="nextbigleap.com"])::after{
-
content:"\2197";
-
}
-
<a href="http://www.nextbigleap.com">I wont display an external link arrow</a>
-
<a href="http://www.google.com">I will display an external link arrow</a>
-
-
-
a[href="#"]::after{content:"\2620";} /* Exact match eg # */
-
<a href="#">I will display skull and crossbones</a>
[...] http://www.nextbigleap.com/blog/development/copy-paste-list-of-css-snippets/ another great website that allows you to share various CSS snippets. [...]