在div元素内的Markdown表

Question

我正在尝试将一个表格放在markdown中，所以我想把它放在div中，然后text-align将内容放到center。

<div class="myWrapper" markdown="1">


| Col1 | Col2 | Col3 | 
| ------ | ------ | ------ | 
| r0 | r0 | r0 | 
| r1 | r1 | r1 | 
| r2 | r2 | r2 | 
| r3 | r3 | r3 | 
| r4 | r4 | r4 | 


</div>

但这样做会将其转换为纯HTML 我的问题是：我如何在div中使用该降价表？并正确呈现

Answer 1

查看this

  

请注意，在块级HTML标记中不处理Markdown格式化语法。例如，您不能在HTML块中使用Markdown样式的强调。

但

  

与块级HTML标记不同，Markdown语法在span-level标记内处理。

Answer 2

这个答案与问题无关。我正在解决在一个 Markdown 文档中定义不同表格样式的问题。我正在使用 Python-Markdown。

The default table stile: 

Item No | Name | Description | Price
--------|------|-------------|------
1       | Chair | Kitchen chair | 101.50
2       | Table | Kitchen table | 450.00

The "plated" table style:

<div class="tablePlated"></div>

|Item No | Name | Description | Price|
|--------|------|-------------|------|
|1       | Chair | Kitchen chair | 101.50|
|2       | Table | Kitchen table | 450.00|

And the "gridded" table style:

<div class="tableGridded"></div>

Item No | Name | Description | Price
--------|------|-------------|------
1       | Chair | Kitchen chair | 101.50
2       | Table | Kitchen table | 450.00

这里是 CSS 规则：

table {
    font-size: 16px;
}

td, th {
    padding: 7px 14px;
}

div.tablePlated+table {
    border-spacing: 1px;
    border-collapse: separate;
}

div.tablePlated+table td, div.tablePlated+table th {
    background-color: lightblue;
}

div.tableGridded+table {
    border-spacing: 0;
    border-collapse: collapse;    
}

div.tableGridded+table td, div.tableGridded+table th {
    border: solid 1px dodgerblue;
}

结果如下：