如何使ckeditor创建的页面内容响应

Question

我正在使用Ckeditor为帖子和页面创建内容。我想知道如何使内容响应（不购买一些ckeditor引导插件）？

有两种可能的方式让我想到： 1.解析ckeditor生成的原始html代码，并在将数据存储到数据库之前，将引导类添加到相应的html标记（例如img-responsive等）。 2.在css文件中添加媒体查询。

我不知道哪种方法更好，以及如何实施。我感谢您的建议！提前谢谢！

Answer 1

我建议你深入研究你的第二个选择：CSS媒体查询。它将允许您更大范围的定制，并最终有益于您的开发技能。如果您已经了解使用CSS选择器和属性，那么媒体查询很难知道如何使用，并且不会太难。

Answer 2

如果您自己使用ckeditor（而不是您的用户创建内容），那么您可以使用＆＃39;源模式＆＃39;插件编辑原始html并添加所需的引导类。 这是基于这样的假设：引导程序已经加载到将显示ckeditor内容的任何页面上，或者脚本通过“源模式”包含在内。 http://ckeditor.com/addon/sourcearea

Answer 3

对于我来说，我将所有ckeditor内容包装到一个带有.note-content类的div中，并设置div中媒体的最大宽度。

.note-content
{
  img, iframe {
    max-width: 100%;
    height: auto !important;
  }
}