Repurposing CSS Class Selectors
Posted
by
limefartlek
on Pro Webmasters
See other posts from Pro Webmasters
or by limefartlek
Published on 2012-09-21T14:16:28Z
Indexed on
2012/09/21
15:54 UTC
Read the original article
Hit count: 152
css
I don't know what this technique is called, I've only seen it used. It's a way to repurpose the same selectors with CSS.
For example if I create
h1 {
font-size:18px;
color:#FFFFFF;
font-family:Arial, Helvetica;margin:0;
padding:0;
}
h2 {
font-size:18px; color:#000000;
font-family:Arial, Helvetica;
font-weight:normal;margin:0;
padding:0;
}
I can repurpose the h selectors with something like
.whatever h1 {
color: #000;
font: 2.0em arial, sans-serif;
background-color: #fff3ea;
margin: 50px 0px 0px 50px;
}
.whatever h2 {
color: #000;
font: 1.7em bold arial, sans-serif;
background-color: #fff3ea;
margin: 25px 0px 25px 75px;
}
If h1
and h2
appear inside of a div
called whatever, then they will assume those properties. You can do this with ID tags and class tags but I can't for the life of me remember how this is done.
Any thoughts?
© Pro Webmasters or respective owner