markedjs表没有样式

时间:2018-03-24 15:57:51

标签: javascript css html-table javascript-marked

我在我的网站上使用markedjs降价解析器,但表格语法没有正确的方式(没有边框和条纹)。我的代码:

new_object=MyClass(id=0, name="Test")
mylist.append(new_object)

1 个答案:

答案 0 :(得分:0)

这不是marked问题,而是CSS问题。由于您没有为表格指定任何样式,因此您没有得到任何样式:)。

编辑 Here是一个使用带有标记的Bootstrap的示例。

非引导示例:

<!doctype html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Marked in the browser</title>
    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
    <style>
        table { border-collapse: collapse; }
        tr { border-bottom: solid 1px black; }
        tr:nth-child(even) {background-color: #f2f2f2;}
    </style>
</head>
<body>
<div id="content"></div>
<script>

    document.getElementById('content').innerHTML =
        marked(`
First Header | Second Header
------------ | -------------
Content Cell | Content Cell
Content Cell | Content Cell
        `);
</script>
</body>
</html>

  • table { border-collapse: collapse; }this answer每个tr边框启用。
  • tr { ... }为您提供行之间的界限。
  • tr:nth-child(even) { ... }为您提供了阴影。