| 主题: 较严重的界面CSS冲突问题! |
| 作者: 笑风影, 发布日期: 2009-08-15 12:11:53, 浏览数: 6553 |
|
编辑器采用的是TABLE来表现的,但如果在编辑器外部又套用了一个TABLE并且定义了此TABLE下的TD的CSS参数,那将会导致编辑器变形!! BUG重现如下(注意我定义的#right table td这个CSS样式):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>KindEditor 3.2</title>
<style type="text/css" rel="stylesheet">
#right table td{
border:1px solid #8F9EAC;padding:8px; text-align:center;
}
</style>
<script type="text/javascript" charset="utf-8" src="./../kindeditor.js"></script>
<script type="text/javascript">
KE.show({
id : 'content1',
cssPath : './index.css'
});
</script>
</head>
<body>
<h3>默认模式</h3>
<div id="right">
<table>
<tr>
<td>
<textarea id="content1" name="content" style="width:700px;height:200px;visibility:hidden;">
<p><strong>月下独酌</strong> - 李白</p>
<p>花间一壶酒，独酌无相亲。</p>
<p>举杯邀明月，对影成三人。</p>
<p>月既不解饮，影徒随我身。</p>
<p>暂伴月将影，行乐须及春。</p>
<p>我歌月徘徊，我舞影零乱。</p>
<p>醒时同交欢，醉后各分散。</p>
<p>永结无情游，相期邈云汉。</p>
</textarea>
</td>
</tr>
</table>
</div>
</body>
</html>
我在做一个站时,本想采用KindEditor的,但碰到类似于上面的问题,不得不放弃.毕竟,原网站的CSS中定义了类似于上面的CSS,导致影响到编辑器界面.也不可能为了适应编辑器而大量修改原网站上的CSS定义和页面.希望作者能在下一版本中修改一下这种CSS冲突问题. |
| 作者: Roddy, 发布日期: 2009-08-15 13:11:30 |
|
编辑器使用skins目录里的default.css设置样式，所以会受后面的CSS和页面直接定义的CSS的影响。
解决方法是你的CSS不要直接写在页面里，提取一个CSS文件放在head标签内。 比如 <head> <link href="./css/common.css" type="text/css" rel="stylesheet"></link> </head> 加载编辑器后是用Firebug查看顺序应该是这样的。 <head> <link href="./css/common.css" type="text/css" rel="stylesheet"></link> <link type="text/css" rel="stylesheet" href="http://kindsoft.net/kindeditor/skins/default.css"></link> </head> |
| 回复 |
| 作者: 笑风影, 发布日期: 2009-08-15 13:48:54 |
|
将CSS提取放到CSS文件.在IE8下都是一样出现CSS冲突问题的. 我的网站就是将CSS放到一个文件里的.也就是像你所说的. |
| 回复 |
| 作者: Roddy, 发布日期: 2009-08-15 14:27:23 |
|
用Firebug看看那些受影响的标签，如果default.css里没有，自己加上去。
|
| 回复 |
