覆盖现有 CSS 表规则的最佳方法是什么?

2024-05-08

我们正在使用 joomla 模板,其中创建者在constant.css 中定义了规则

table   
{
  border-collapse:collapse; 
  border:0px; 
  width:100%;
}

当我需要我自己的带有自定义参数(宽度、边框等)的表格时,一场噩梦就开始了。如果我使用通用 html 参数,它们将不起作用,因为 css 规则更重要(CMIIW)。如果我使用 style= param,我想我无法控制表格在 IE 中的查找方式(最多 7 个)。

那么是否有一个通用的方法来解决这个问题,或者我只需要评论该规则(就像我已经做的那样)。

另外,如果我说 joomla 模板的创建者不应该默认定义像 width:100% 这样的一般规则,我对吗?我的意思是,如果他们不希望他们的模板的用户抱怨。


Method 1

在您创建的所有表上放置一个类,然后创建一个选择器,例如table.classname覆盖属性。由于您应该只将表格用于表格数据,因此添加类名是有意义的,因为将其他样式(颜色、边框)应用到所有表格会更容易。

  • 覆盖border-collapse: collapse, use border-collapse: separate随着border-spacing: 4px(或任何值)。这在 IE6 中不起作用,也可能在 IE7 中不起作用。
  • 对于桌子周围的边框,只需添加一个border规则。如果您想要单个单元格的边框,请定位table.classname td并把border统治那里。
  • 要重置宽度,请使用width: auto或设置明确的宽度。

Method 2

另一种方法是查找模板中使用的所有表,向其中添加一个类,然后更改原始规则以使用该类。然后,任何没有该类的表都将使用默认的表属性。

这可能很难实现,因为 Joomla 模板通常具有模块和组件覆盖,这意味着很多地方都会有很多表。祝你好运! :p

你是对的,设置这些样式(嗯,width至少)在通用表格元素上对于模板来说是一个坏主意。尽管他们可能使用表格进行布局这一事实无论如何都不是一个好兆头。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

覆盖现有 CSS 表规则的最佳方法是什么? 的相关文章

随机推荐