+ -
当前位置:首页 → 问答吧 → 【求助】怎么才能让外部定义的样式不影响某容器内的继承?

【求助】怎么才能让外部定义的样式不影响某容器内的继承?

时间:2011-03-07

来源:互联网

事情是这样滴~我做了个Console,当然,是JS和CSS做出来的,基本原理是加载js后便自己初始化,即往body里插入一个div容器,并在div内画出console,然后加载相关的css文件。
在一个普通页面上,这个Console的运行还不错,但是换到特殊环境,看上去样式就会被打乱,原因是body引入的css文件定义了全局的样式,比如img,span等等,虽然这些方法不被推荐,但保不齐会有网站用到,这便直接影响到Console的美观,甚至会无法使用。比如baidu首页就定义了全局样式text-align:center;,于是Console里的所有内容都居中了~
解决这个问题的方法有其一:把容器和容器内的所有标签都替换为自定义标签……这个方法比较狠,虽然我知道也有其可行性(比如许多web输入法就是这么干的),但是对于一个内部设置较为复杂的Console来说,还是有点儿痛苦。
所以想请教各位达人,有没有更优雅的方法来解除困扰?谢过!

作者: newskyline   发布时间: 2011-03-07

1)把所有Console里面的标签的css 的 默认行为 全部定义一遍 可以写成内联样式
2)允许使用外部未知css文件 ,因为这样可能有更好的 兼容整体 页面显示效果 所以对于整个condole的布局 尽可能依赖js 而不是依赖于样式

作者: KK3K2005   发布时间: 2011-03-07

不知这个问题有什么复杂的,CSS用 区域限定 不就行了吗。
<style>
……其它任意设置,包括外部未知CSS
.theforever_csdn_console div {在这里把你的样式定义一遍...}
.theforever_csdn_console .panel {...}
...
</style>
只要你这个theforever_csdn_console起得名字不可能那么巧被定义就没问题了。

作者: theforever   发布时间: 2011-03-07

回楼上两位。
首先是theforever,可能我没表达太清楚,其实我已经是按照你这么做的了,的确是不太可能污染到外部,关键是这样不足以防止我的Console被外部污染,标签的样式属性会继承的,这个知道吧,比如外部定义一个全局的span{color:red},那我的Console所有没定义color的span都变成红色了~
@KK3K2005,其实我蛮想按照您说的方法一,但我发现这样太被动了,因为样式总是无孔不入,或者你有没有这样一个万能的样式表初始化代码可以提供给我,诸如上面所说的color:red这样的可以不被继承~第二个建议可否详细描述一下,我不太理解~
Thanks to two nice men!

作者: newskyline   发布时间: 2011-03-07