github-markdown-css样式⽂件-⼀般⽤作⽂章正⽂的样式美化1.下载到项⽬中
cnpm i github-markdown-css
2.将样式放到模块化vue⽬录下，然后在 style中导⼊
<style scoped lang="less">
@import './github-markdown.css';
</style>
3.在vue脚⼿架中的 .postcssrc.js⽂件中加⼊ exclude: 'github-markdown'  //css样式⽂件
// 配置要使⽤的 PostCSS 插件
plugins: {
// 配置使⽤ autoprefixer 插件
/
/ 作⽤：⽣成浏览器 CSS 样式规则前缀
// VueCLI 内部已经配置了 autoprefixer 插件
// 所以⼜配置了⼀次，所以产⽣冲突了
// 'autoprefixer': { // autoprefixer 插件的配置
//  // 配置要兼容到的环境信息
//  browsers: ['Android >= 4.0', 'iOS >= 8']
// },
// 配置使⽤ postcss-pxtorem 插件
// 作⽤：把 px 转为 rem
'postcss-pxtorem': {
rootValue ({ file }) {
return file.indexOf('vant') !== -1 ? 37.5 : 75
},
// 配置要转换的 CSS 属性
// * 表⽰所有
propList: ['*'],
exclude: 'github-markdown'  //css样式⽂件
}
如何用css美化表单
}
4.在需要美化的正⽂部分加⼊github-markdown-css样式⽂件的主样式类名
markdown-body ⽣效!!!
<!-- ⽂章内容 -->
<div class="article-content markdown-body"
v-html='t'
ref="article-content"></div>
<van-divider>the end</van-divider>
</div>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。