// 使用 rich-text 加载富文本数据
<rich-text class="richText" :nodes="nodes"></rich-text>

一 .对 H5 中的详情

1. 自适应HTML内容 中的图片大小.

// 全局搜索并替换图片样式
 this.nodes = this.item.content.replace(/<img/gi,'<img style="max-width:100%;height:auto;margin:0 auto;display:block"')

2. 使用增加权重的方式, 修改 HTML 内容中的字体样式.

    .richText {
        padding: 0rpx 30rpx 0rpx 30rpx;
        // line-height:1.667em;
        // letter-spacing:0.5px;
        text-align:justify;
        word-break: break-all;
        p{
            font-size: 32rpx !important;
            // text-indent: 2em !important;
            text-align: justify !important;
            color: #333333 !important;
            line-height:1.667em !important;
            letter-spacing:0.5px !important;
            word-break: break-all !important;
            // margin-bottom: 28rpx !important;
        }
        span{
            font-size: 32rpx !important;
            text-indent: 2em !important;
            text-align: justify !important;
            color: #333333  !important;
            line-height:1.667em !important;
            letter-spacing:0.5px !important;
            word-break: break-all !important;
        }
    }

二. 对于微信小程序

.1. 自适应HTML内容 中的图片大小.

// content 为后端返回的富文本内容
formatImg(content) {
    if (!content) return '';
        const regex = /<img[^>]*>/g;
        content = content.replace(regex, function(match) {
        return match.replace('>', 'style="max-width:100%;height:auto;">');
        });
    return content;
},

2. 直接使用class增加权重的方式, 修改 HTML 内容中的字体样式

    .richText {
        padding: 0rpx 30rpx 0rpx 30rpx;
        // line-height:1.667em;
        // letter-spacing:0.5px;
        text-align: justify;
        word-break: break-all;

        font-size: 32rpx !important;
        // text-indent: 2em !important;
        text-align: justify !important;
        color: #333333 !important;
        line-height: 1.667em !important;
        letter-spacing: 0.5px !important;
        word-break: break-all !important;
        // color: red !important;
        // margin-bottom: 28rpx !important;
    }