storybook使用addon-info时，Prop Types表格没有边框

在使用storybook addon-info时，按照文档的指引来配置，运行后：


可以通过覆盖样式解决。
新建一个storybook.scss，添加以下内容，然后在全局样式文件index.scss中引入

// storybook.scss
.info-table, .info-table td, .info-table th {
  border-collapse: collapse;
  border: 1px solid #ccc;
  color: #444;
  margin-top: .25rem;
  padding-right: .5rem;
  padding: .25rem;
  text-align: left;
  vertical-align: top;
}

.info-table {
  width: 100%;
}

.info-table-monospace {
  font-family: Menlo, Monaco, "Courier New", monospace;
  font-size: .88em;
}

// index.scss 引入
@import '../styles/storybook';

保存，打开浏览器看效果：


这样就好多了。

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容