Question

我的问题是，是否可以为一个div重置css样式（很多它们）以及该div中包含的所有元素。

我在问，因为我发现这个教程是为了拥有它自己的jquery shoutbox css文件。我不能只将样式复制到我自己的css文件中，因为它会将已经设置好样式的页面上的其余部分搞定。

我想过使用divwrapper并将所有这些重置仅应用于那个。我只是不确定是否可能

我只知道这种方式

#divwrapper td{ set styles }

@CHARSET "UTF-8";
/******* GENERAL RESET *******/
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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
 tfoot, thead, tr, th, td {
border:0pt none;
font-family:inherit;
font-size: 100%;
font-style:inherit;
font-weight:inherit;
margin:0pt;
padding:0pt;
vertical-align:baseline;
}

谢谢，理查德

Answer 1

试试这个：

div.foo, div.foo *
{
    // your styles
}

将使用类“foo”及其所有后代将样式应用于div。星号（*）被称为universal selector，毫不奇怪，选择任何类型的元素。

或者只针对直系孩子：

div.foo, div.foo > *
{
    // your styles
}

Answer 2

如果可行，您可以将所有内容设置为在iframe中“重置”。 iframe内容不会继承任何内容。

Answer 3

如前所述@Noldorin，您需要一个使用通用选择器选择所有后代（或子项）的选择器。

有关选择器的更多信息，请查看W3C的文档。 CSS2选择器信息为here

示例代码（我选择使用ID而不是类使用选择器）来说明：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reset</title>

<style>
.red{
    color: red;
}
.blue{
    color: blue;
}
.green{
    color: green;
}

#reset *{
    color: black;
}

#resetc > *{
    color: black;
}

</style>
</head>
<body>
<h1>With Descendant Reset Style</h1>
<div id="reset">
  <div class="red">Red</div>
  <p class="green">Green<span class="blue">Blue</span></p>
</div>

<h1>With Child Reset Style</h1>
<div id="resetc">
  <div class="red">Red</div>
  <p class="green">Green<span class="blue">Blue</span></p>
</div>

<h1>Without Reset Style</h1>
<div>
  <div class="red">Red</div>
  <p class="green">Green<span class="blue">Blue</span></p>
</div>
</body>
</html>

为一个div元素重置多个css样式

3 个答案: