可能重复:
如何防止CSS继承？
有没有办法声明元素的CSS属性,使其不会影响它的任何子元素,或者是否有办法声明元素的CSS只实现指定的样式,而不是继承为其父元素声明的任何样式？
一个简单的例子
HTML:
<body>
<div id='container'>
<form>
<div class='sub'>
Content of the paragraph
<div class='content'>Content of the span</div>
</div>
</form>
</div>
</body>
CSS:
form div {
font-size: 12px;
font-weight: bold;
}
div.content {
/* Can anything go here? */
}
在正常情况下,人们会期望文本块"段落的内容"和"跨度的内容"都是12px和粗体.
是否有一个属性包含在上面的CSS中的"div.content"块中,这将阻止它继承"#container form div"块中的声明,以将样式限制为"段落的内容"并且备用"跨度的内容"包括任何其他儿童div？
如果你想知道为什么,好吧,我创建了一个特定的CSS文件,它给我项目中的所有表单一个特别的感觉,并且表单下的div都继承了这种感觉.没问题.但是在我希望使用Flexigrid的形式内部,但flexigrid继承了样式,它看起来没用.如果我在表单之外使用flexigrid并且它不会继承表单css,那么它看起来很棒.否则它看起来很糟糕.
我在使用jQuery .show("slide")动画的界面设计中使用tinyMCE时遇到了问题.由于表单的复杂性,它被分解为很像向导的页面,但它不使用下一个和后一个按钮.相反,它使用部分名称ed Biodata,Contact Information,Save.为了增添趣味,点击的部分将滑入视图.这个"幻灯片"已经定义了项目的开发者和赞助者之间的接口,我们将它们称为滑动形式.但是,在其中一个"页面"中,需要一个文本编辑器.问题是一旦编辑器页面滑入视图,我可以使用tinyMCE的execCommand函数初始化它,但是一旦你滑出那个页面并将其重新滑入,编辑器就会丢失它的内容并且即使我成为"不可编辑的"重新初始化它.然而,如果我禁用幻灯片并只加载页面.css("display", "block"),编辑工作正常,但我们的"滑动形式"的整个本质已经丢失.那么有没有能够使用show("slide")和保持编辑理智的工作？
下面的代码不起作用
$(this).show( "slide", { direction:"left" }, 1000 );
下面的代码有效
$(this).css('display', 'block');
任何帮助表示赞赏.