How to select * but exclude <body>? Or set <body> to default style?
Question
Browsers usually set different default styles for elements. Users can also override the defaults using custom stylesheets .
I often override these default styles using my own styles, eg:
* {padding:0; margin:0; }
However, I wish to respect the default stylesheet for certain element attributes, eg the <body> 's default padding and margin. I tried:
* { padding:0; margin:0; }
body { padding:default; margin:default; }
But it doesn't work. Neither does initial .
Is there a way to solve this problem by selecting all elements but excluding <body> ?
5 answers
solution1
10 ACCPTED 2011-06-13 09:41:50
Is there a way to solve this problem by selecting all elements but excluding
<body>?
Since everything that is displayed in the viewport consists of <html> , <body> and <body> 's contents by default, you can just select html , and all of body 's descendants:
html, body * { margin: 0; padding: 0; }
default doesn't work because there is no such keyword. initial doesn't work because the initial margins are 0. It is not possible to reset a property to its browser-given default value after you have changed it using CSS.
solution2
2 2011-06-13 09:42:17
html, head, head *, body * { }
solution3
2 2011-06-13 09:42:20
<html> and all descendants of <body> :
html, body * {padding:0;margin:0;}
solution4
1 2011-06-13 09:42:11
Use the body * selector.
body *{padding:0;margin:0;}
solution5
0 2011-06-13 09:49:35
Set them first to 0, then override the wanted values afterwards. You'd be better off using a CSS Reset though, but if you reall want to use the asterisk, this method will work.
* {
padding:0;
margin:0;
}
body, html {
padding: 10px;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.