Printable View
I have a css class "shadow" defined which specifies a default box-shadow for easily adding a shadow to individual elements. Is it possible to apply this class to all elements of a specific type (eg. all blockquote elements) without having to re-type the stuff inside .shadow{} into blockquote{} for each element? If it can't be done without javascript then I won't bother about it.
well if you type div { border:1px solid black; } then all divs will have a 1 pixel border thats solid black... so if i get what you mean is then just type the elements type for example ul { something} like this:
this adds a border around the blackquote
Code:<html>
<head>
<style type="text/css">
blockquote {
border:1px solid black;
}
</style>
</head>
<body>
<blockquote>
This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation. This is a long quotation.
</blockquote>
</body>
</html>
Code:.shadow,
blockquote {
/* this style will be applied to both elements with a .shadow class and blockquote elements */
}
Thanks. Don't know why I didn't think of that earlier :)Quote:
Originally Posted by kows
oh sorry now i see kows has the class of the element i get what you mean
i got a good site that you can learn fast of: w3schoolsCode://class + id
.form #textbox { }
//multiple classess
.form .inputs { }
//multiple ids is same as classes...
//class and elements
.form input { /*code for all inputs such as text, password, submit buttons...*/ }
//multiple elements like h1, h2...
h1, h2, h3, h4, h5, h6 { color:green; }
These two are not right. The top one is actually "an element with id 'textbox' within an element with class 'form'." If you want to specify "an element with class 'form' and id 'textbox'," you cannot have whitespace between them (and I'm not sure, but the ID may have to go first):Code://class + id
.form #textbox { }
//multiple classess
.form .inputs { }
//multiple ids is same as classes...
Same for multiple classes: no whitespace or else it's "class within a class."Code:#textbox.form{}
Code:.form.inputs{}
from his comment about header tags in his code (h1, h2, h3, ...), I would assume he just forgot the commas in his example. but I'm not entirely sure.
anyhow, I've never seen the double class notation (.classone.classtwo), but I know I could find it handy.
if there is no comma then it will take the element h2 inside h1 and the element h3 inside h2 which is inside h1 which is not very good, therefore a comma(, not seperator xD).