rem単位
1121 ワード
css:
js:
メディアクエリーの具体的なfont-sizeは、デザイナーたちと一緒にデバッグして、自分の会社に合ったセットを書く必要があります.
参考資料1参考資料2
html {
font-size : 20px;
}
@media only screen and (min-width: 401px){
html {
font-size: 25px !important;
}
}
@media only screen and (min-width: 428px){
html {
font-size: 26.75px !important;
}
}
@media only screen and (min-width: 481px){
html {
font-size: 30px !important;
}
}
@media only screen and (min-width: 569px){
html {
font-size: 35px !important;
}
}
@media only screen and (min-width: 641px){
html {
font-size: 40px !important;
}
}
js:
!(function(doc, win) {
var docEle = doc.documentElement,
evt = "onorientationchange" in window ? "orientationchange" : "resize",
fn = function() {
var width = docEle.clientWidth;
width && (docEle.style.fontSize = 20 * (width / 320) + "px");
};
win.addEventListener(evt, fn, false);
doc.addEventListener("DOMContentLoaded", fn, false);
}(document, window));
メディアクエリーの具体的なfont-sizeは、デザイナーたちと一緒にデバッグして、自分の会社に合ったセットを書く必要があります.
参考資料1参考資料2