CKEditor表宽度和列宽度单位

Question

我目前正在测试CKEditor。

特别是表格调整大小和表格插件的功能。

到目前为止，我发现它似乎有时适用于pt，有时适用于px。

有没有一种方法可以更改行为以始终使用百分比或某种其他相对比率（而不是列宽度的px或pt）工作？

<table border="1" cellpadding="1" cellspacing="1" style="width:1340px">
    <thead>
        <tr>
            <th scope="col" style="width:386px">1</th>
            <th scope="col" style="width:953px">
            <p>2</p>
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="width:386px">3</td>
            <td style="width:953px">4</td>
        </tr>
    </tbody>
</table>

我的原始帖子在http://ckeditor.com/forums/CKEditor/CKEditor-Table-Width-and-Column-Width-Units上 。 我决定将其发布在这里，因为两天没有关于我的问题的活动。

我正在寻找一种通过配置或通过JavaScript以编程方式通过CKEditor修改表插件的简便方法，以将px等单位更改为百分比或任何其他相对单位。

更新

我想要的是用户在所见即所得的表格中看到例如在编辑时宽度为100％。 当用户更改该列时，他们的更改百分比而不是像素。 或者用户使表格小于总宽度的100％。 然后，表格以％而不是px进行更改。

Answer 1

似乎没有更改此行为的配置设置，并且编辑插件本身可能有点让人头疼。

您可以简单地为表格指定一个百分比宽度，其余部分保持不变。 大多数现代浏览器都会按比例处理/调整单元格的大小。 您可以使用jquery甚至使用简单的CSS声明来强制执行此操作。 例如： $("table").width("100%"); 或table { width: 100% !important; } table { width: 100% !important; } 。

另外，您可以使用jquery来获取当前宽度并将其更改为百分比，例如，类似于以下内容：

var tableWidth = $("table").width();
$("table tr").children().each(function( index ) {
    $(this).width(Math.round(100 * $(this).width() / tableWidth)+"%");
});

 $("table").width("100%"); var tableWidth = $("table").width(); $("table tr").children().each(function( index ) { $(this).width(Math.round(100 * $(this).width() / tableWidth)+"%"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border="1" cellpadding="1" cellspacing="1" style="width:1340px"> <thead> <tr> <th scope="col" style="width:386px">1</th> <th scope="col" style="width:953px"> <p>2</p> </th> </tr> </thead> <tbody> <tr> <td style="width:386px">3</td> <td style="width:953px">4</td> </tr> </tbody> </table> 

有关如何使用类名将其添加到专门针对CKEditor表的信息，请参见： https : //stackoverflow.com/a/7980775/2126792