首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使用实线边框css样式

如何使用实线边框css样式
EN

Stack Overflow用户
提问于 2018-08-03 03:56:25
回答 1查看 111关注 0票数 0

因为弹性手表不支持<style>,所以我需要使用<th style=\"...\">格式。但不知何故,我无法让我的实心边框正常工作。

代码语言:javascript
运行
复制
<html>
  <body>
    <table style=\"font-family:'TrebuchetMS',Arial,Helvetica,sans-serif;background-color:#D8E5E8;border-collapse:collapse;width:100%;max-width:700px;min-width:100px;text-align:center;border:2px solid #ddd;\">
      <tr>
        <th style=\"font-size:12pt;background-color:#1A94BD;color:white;height:20px;padding:2px;vertical-align:middle;border:2pxsolid#ddd;\">Timestamp</th>
        <th style=\"font-size:12pt;background-color:#1A94BD;color:white;height:20px;padding:2px;vertical-align:middle;border:2pxsolid#ddd;\">User</th>
        <th style=\"font-size:12pt;background-color:#1A94BD;color:white;height:20px;padding:2px;vertical-align:middle;border:2pxsolid#ddd;\">Event Type</th>
        <th style=\"font-size:12pt;background-color:#1A94BD;color:white;height:20px;padding:2px;vertical-align:middle;border:2pxsolid#ddd;\">Node Name</th>
        <th style=\"font-size:12pt;background-color:#1A94BD;color:white;height:20px;padding:2px;vertical-align:middle;border:2pxsolid#ddd;\">Uri</th>
      </tr>
      {{#ctx.payload.list}}
      <tr>
        <td style=\"font-size:10pt;height:20px;padding:2px;vertical-align:middle;border:2px solid #ddd;\">{{be_time}}</td>
        <td style=\"font-size:10pt;height:20px;padding:2px;vertical-align:middle;border:2px solid #ddd;\">{{user}}</td>
        <td style=\"font-size:10pt;height:20px;padding:2px;vertical-align:middle;border:2px solid #ddd;\">{{event_type}}</td>
        <td style=\"font-size:10pt;height:20px;padding:2px;vertical-align:middle;border:2px solid #ddd;\">{{node_name}}</td>
        <td style=\"font-size:10pt;height:20px;padding:2px;vertical-align:middle;border:2px solid #ddd;\">{{uri}}</td>
      </tr>
      {{/ctx.payload.list}}
    </table>
  </body>
</html>

我需要如何格式化'border:2px solid #ddd;'才能得到一个漂亮的边框。当我使用<style>时,我可以让它像我想要的那样工作:

代码语言:javascript
运行
复制
<style>table{font-family:'TrebuchetMS',Arial,Helvetica,sans-serif;background-color:#D8E5E8;border-collapse:collapse;width:100%;max-width:700px;min-width:100px;text-align:center;}table,th,td{border:2px solid #ddd;}th,td{height:20px;padding:2px;vertical-align:middle;}td{font-size:10pt;}th{font-size:12pt;background-color:#1A94BD;color:white;}</style>

但无论我在style=\"..'border:2px solid #ddd;' 'border:2pxsolid#ddd;'中尝试什么,都没有显示边框

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51661247

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档