基本はpx使っているためか、remとemの使い方をすぐに忘れてしまいます…
rem html要素のfont-sizeを基準とする。
html {
font-size: 32px;
}
h1 {
font-size: 2rem; /* 64px */
}
div {
font-size: 0.5rem; /* 16px */
}
em 親要素のfont-sizeを基準とする。
html {
font-size: 32px;
}
h1 {
font-size: 2em; /* 64px */
}
.content {
font-size: 16px; /* 16px */
}
.content .child {
font-size: 0.5em; /* 8px */
}