在所见即所得编辑器中创建表格布局

时间:2016-08-17 作者:Kiran Dash

我有一个图像中提到的设计。

enter image description here

这些内容应该放在小部件中。我现在是如何做到这一点的:通过在所见即所得编辑器中使用文本之间的空格进行编辑。有没有其他方法可以正确对齐。

我在我的许多项目中都遇到过这样的布局,到目前为止,我一直在使用空格来对齐它们。但在我最近的项目中,我发现使用空格并不是正确的解决方案,因为在我的情况下,我使用的字体在不同的浏览器上表现有点不同,因此空格不一致。

所以,在chrome上使用空格我得到了正确的结果,但在firefox上,空格的间隔是不一样的。

firefox上的结果:

enter image description here

我想在WYSIWYG编辑器中创建这样的表格布局可能有更好的解决方案。如果有,请告诉我。谢谢你的时间。

1 个回复
最合适的回答,由SO网友:Krzysztof Grabania 整理而成

为什么不使用表?空间是可笑的。在WYSIWYG编辑器上,选择具有2列和3行的表,将左列中的项目向左对齐,将右列中的项目居中对齐,所有操作都应正常进行。

编辑好的,我知道问题出在哪里了。TinyMCE(WYSIWYG编辑器)有table选项,但默认情况下在WordPress中是禁用的。例如,您可以下载插件TinyMCE Advanced, 并启用各种功能强大的TinyMCE选项。此外,您还可以将视图切换到文本编辑器并在HTML中添加表格:

<table>
    <tr>
        <td>Cell</td><td>Cell</td>
    </tr>
    <tr>
        <td>Cell</td><td>Cell</td>
    </tr>
    <tr>
        <td>Cell</td><td>Cell</td>
    </tr>
</table>

相关推荐

EDITOR-Style.css功能

场景:我有一个客户很难理解,他在WordPress面板上看到的帖子字体样式不一定是前台显示的样式。TinyMCE插件的过度使用导致每个文本块标记内部都有一个跨度,因为他试图使编辑器与前面已经发生的事情相匹配,因为有一个子主题。由于这种做法,网站上的文本格式不统一。目标:我想让编辑器的字体(乔治亚州)与他想要的字体在前面匹配(而这正发生在前面)。此外,我想更改格式菜单,以匹配我们商定的子主题CSS。设置:他使用的主题没有编辑风格。css。我已经添加了一个,但我的研究导致了信息的混乱,而不是一套清晰的说明&l