wangeditor生成带样式的html,自定义表格、引用、代码的样式

编辑器对编辑内容中的表格、引用区域、代码区域做了默认的样式处理。如果想要自定义这些区域的样式，可通过在`html`页面中增加以下样式来修改：

```css

.wangEditor-container .wangEditor-txt blockquote {

/* 在此自定义引用区域样式 */

}

.wangEditor-container .wangEditor-txt table {

/* 在此表格样式 */

}

.wangEditor-container .wangEditor-txt table td,

.wangEditor-container .wangEditor-txt table th {

/* 在此表格样式 */

}

.wangEditor-container .wangEditor-txt pre {

/* 在此代码区域样式 */

}

```

**注意：以上`css`选择器要按照代码示例中编写，否则无效。**

----

wangEditor 默认的这些区域的样式，可以在下载的文件中找到 `wangEditor.css` 然后搜索 `blockquote` `table` `pre` 等这些关键字找到。

例如(**具体以搜索的结果为准**)

```css

.wangEditor-container .wangEditor-txt blockquote {

display: block;

border-left: 8px solid #d0e5f2;

padding: 5px 10px;

margin: 10px 0;

line-height: 1.4;

font-size: 100%;

background-color: #f1f1f1;

}

.wangEditor-container .wangEditor-txt table {

border: none;

border-collapse: collapse;

}

.wangEditor-container .wangEditor-txt table td,

.wangEditor-container .wangEditor-txt table th {

border: 1px solid #f1f1f1;

padding: 3px 5px;

min-width: 50px;

height: 20px;

}

.wangEditor-container .wangEditor-txt pre {

border: 1px solid #ccc;

background-color: #f8f8f8;

padding: 10px;

margin: 5px 0px;

font-size: 0.8em;

border-radius: 3px;

}

```