防止meyer重置css混乱动态内容

Question

我在我的网站上实现了Eric Meyer的reset.css，效果很好，但这是一个小问题。因此，CMS用户可以根据需要自由格式化文章内容，重置CSS会重置其文本的格式。

我们如何阻止reset.css继承传播到动态内容？

所有你输入的内容都非常受欢迎。

Answer 1

它将一直传播（这是reset.css :)的重点，但如果你还没有这样做，你当然应该确保reset.css是你页面中链接的第一个样式表 - 然后，任何自定义样式都将覆盖重置样式。

如果问题是样式“太重置”并且你想要一套更合理的默认值（例如加权字体大小，边距，行高等），你可以创建自己的基线CSS样式并仅使用ID选择器将它们应用于动态内容区域。

Answer 2

正如Eric Meyer自己在CSS Reset页面上所说：

  

这里给出的重置样式是   故意非常通用。那里   不是任何默认颜色或背景   例如，为body元素设置。   我不特别推荐   你只是在它未改变的地方使用它   在你自己的项目中陈述。这应该   被调整，编辑，扩展和   否则调整以匹配您的具体   重置基线。填写您的首选   页面，链接等的颜色。

     

换句话说，这是一个开始   点，不是一个独立的黑匣子   没有任何感觉。

从它的外观来看，你发现CSS重置对你来说太过分了。因此，我会针对您遇到问题的项目进行调整。例如，当您遇到表的问题时，我会删除目标表的CSS重置部分，从而将其保留在浏览器默认位置，或者在重置后添加自己的额外CSS以专门设置表格样式方式。

Answer 3

我遇到过类似的问题，我的解决办法是将所见即所得编辑器生成的动态内容包装成一个带有唯一类的div，在那个类中，我创建了一个带有标准属性的重置样式表！

<强>例：

  

div.wrap_to_prevent {style，style，   风格}

     

div.wrap_to_prevent输入，

     

div.wrap_to_prevent textarea，

     

div.wrap_to_prevent h1 {style，style，   风格}

     

     

     

等

基本上，我使用了重置样式表，但在所有css样式之前都使用了div的类，这样，它只会影响div中的代码，从而为该内容创建一组全新的规则。

由于90％的项目都使用WYSIWYG编辑器，通过这个解决方案，我能够解决同样的问题......

无法判断这是否适合你，但试一试!!

Answer 4

CMS是否创建内联样式？如果是这样，这些应该覆盖reset.css文件中的样式。

如果CMS包含它自己的.css文件，请确保它出现在生成的html输出中的reset.css文件之后。

Answer 5

如果您需要使用css重置，解决此问题的唯一可靠方法是使用iframe元素作为动态内容。 iframe的主要问题是它们无法根据相关文档的大小自动调整高度。如果你可以解决这个问题，我会说这是最轻松的方法。