我有以下CSS:
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td
{
background: transparent;
border: 0;
font-size: 100%;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
body
{
line-height: 1;
}
ol,ul
{
list-style: none;
}
blockquote,q
{
quotes: none;
}
blockquote:before,blockquote:after,q:before,q:after
{
content: '';
content: none;
}
:focus
{
outline: 0;
}
ins
{
text-decoration: none;
}
del
{
text-decoration: line-through;
}
table
{
border-collapse: collapse;
border-spacing: 0;
}
如何更改它以使其仅适用于名为header
的div和其中的元素?
答案 0 :(得分:2)
#header html, #header body, #header div, #header span, #header applet, #header object, #header iframe ... etc etc.
正如beejamin已经指出你需要瘦掉你的CSS,对于一个不具有html标签或身体标签等的div来说是过度杀伤
---------更新
#header, #header div, #header span, #header applet, #header object, #header iframe, #header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header p, #header blockquote, #header pre, #header a, #header abbr, #header acronym, #header address, #header big, #header cite, #header code, #header del, #header dfn, #header em, #header font, #header img, #header ins, #header kbd, #header q, #header s, #header samp, #header small, #header strike, #header strong, #header sub, #header sup, #header tt, #header var, #header b, #header u, #header i, #header center, #header dl, #header dt, #header dd, #header ol, #header ul, #header li, #header fieldset, #header form, #header label, #header legend, #header table, #header caption, #header tbody, #header tfoot, #header thead, #header tr, #header th #header , #header td
{
background: transparent;
border: 0;
font-size: 100%;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
#header
{
line-height: 1;
}
#header ol,#header ul
{
list-style: none;
}
#header blockquote,#header q
{
quotes: none;
}
#header blockquote:before,#header blockquote:after,#header q:before,#header q:after
{
content: '';
content: none;
}
#header:focus
{
outline: 0;
}
#header ins
{
text-decoration: none;
}
#header del
{
text-decoration: line-through;
}
#header table
{
border-collapse: collapse;
border-spacing: 0;
}
由于CSS更改的数量,更简单的解决方案可能是将标题放在单独的html中,并使用对象或iframe将其放在页面上。
在更小的范围内,我在我网站的下拉菜单栏中使用这种风格的选择器 - 它们与IE6一起使用。
虽然替代子选择器http://css-tricks.com/child-and-sibling-selectors/也可以与IE6一起使用吗?
#header > div ...
{
background: transparent;
border: 0;
font-size: 100%;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
只会在你的id = header div中深入一级。