rem設(shè)置font-size字號(hào)顯示不正常

根元素html設(shè)置font-size:100%;,然后用rem給code標(biāo)簽設(shè)置字體大小，結(jié)果顯示出的字號(hào)很大.這是針對(duì)移動(dòng)端的。

@media (max-width: 768px){
    html{
        font-size: 100%; /* 16px=1rem */
    }
    body{
        font-size: 15px;
        font-size: .9375rem; /* 15/16=0.9375rem */
        line-height: 1.8;
    }
    code{
        font-size: 14px;
        font-size: .875rem;
    }
}

code的字體大小按照預(yù)期的應(yīng)該是14px,但是實(shí)際結(jié)果如下：

第一張圖片上，code標(biāo)簽外面沒有pre標(biāo)簽，解析的字體是正常的。
第二張圖片，用pre包裹著code，解析出來(lái)的字體大小大一些，比body的字體要大。
利用rem, 元素的字體大小不是只跟根元素有關(guān)嗎？為什么這里字體大小解析出來(lái)的好像跟根元素font-size沒有關(guān)系？折騰我大半天了，查了很多資料也得不出結(jié)果，求各位大神指教。