wangeditor表格没有边框
时间: 2023-07-24 07:35:58 浏览: 96
如果您使用的是wangEditor的默认样式,表格会没有边框。您可以通过自定义CSS来添加表格边框,具体步骤如下:
1. 在头部的`<style>`标签中添加以下CSS代码:
```css
.w-e-table td, .w-e-table th {
border: 1px solid #ccc;
padding: 5px;
}
```
2. 保存并刷新页面,您应该能够看到表格已经有了边框。
请注意,以上CSS代码只是示例,请根据您的实际需求进行调整。
相关问题
vue wangeditor 表格没有border
你可以通过自定义样式来为 Wangeditor 中的表格添加边框。在 Vue 中使用 Wangeditor,可以通过以下步骤实现:
1. 在组件中引入 Wangeditor,并在 `mounted` 钩子中初始化编辑器:
```javascript
import Editor from 'wangeditor'
export default {
mounted() {
const editor = new Editor('#editor')
editor.create()
}
}
```
2. 在模板中添加一个用于显示编辑器的容器:
```html
<template>
<div id="editor"></div>
</template>
```
3. 在样式文件中添加自定义样式来设置表格边框。可以使用 CSS 的 `border` 属性来设置边框样式。例如,添加以下样式:
```css
#wangEditor-container table {
border-collapse: collapse;
}
#wangEditor-container table td,
#wangEditor-container table th {
border: 1px solid #000;
padding: 5px;
}
```
以上样式将为表格添加 1 像素宽的黑色边框和 5 像素的内边距。
请注意,这里使用的选择器 `#wangEditor-container` 是 Wangeditor 默认生成的编辑器容器的 id,如果你在初始化时指定了其他容器 id,需要相应地修改选择器。
通过以上步骤,你可以为 Wangeditor 中的表格添加边框。记得根据需要自定义样式以满足你的需求。
markdown表格没有边框
你可以通过在表格的每一行和列之间添加竖线(|)来为Markdown表格添加边框。下面是一个示例:
```
| 列1 | 列2 |
| --- | --- |
| 内容1 | 内容2 |
```
在这个示例中,竖线用于分隔每个单元格,并通过在第二行中使用短横线(---)来创建表头和表格的边框。你可以根据需要增加或减少行和列,并在单元格中填入相应的内容。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)