0

私はこの基本的なCSSスタイルを持っています。私がやろうとしているのは、テキストをレスポンシブ(フォント)にすることです。それを行うにはems / remsを使用する必要があることを知っています(正しいかどうかわからないpxへのフォールバックでremsを選択しますが、コードでどのように見ることができます私はそれを正しく設定したかどうかわかりません)、使用した式はフォントサイズを16pxで割ったものです。これで、h タグの相対的なフォント サイズが得られたと思います..しかし、ブラウザのサイズを変更したい場合でも、魔法はかかりません。マージン、パディング、行の高さの設定に rems/other を使用して、rems などを使用してフォントをレスポンシブにする方法を理解するのを手伝ってもらえますか? 複雑な例と説明は大歓迎です:-d お時間をいただきありがとうございます。

html {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
body {
  background-color: #fff;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: #000000;
  position: relative;
  -webkit-font-smoothing: subpixel-antialiased;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  width: 100%;
  min-width: 0;
}
html,
body {
  height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;
  margin: 0  0;
  margin: 0  0;
}
h1 {
  font-size: 3px;
  font-size: 3rem;
}
h2 {
  font-size: 2.25px;
  font-size: 2.25rem;
}
h3 {
  font-size: 1.5px;
  font-size: 1.5rem;
}
h4 {
  font-size: 1.125px;
  font-size: 1.125rem;
}
h5 {
  font-size: 1px;
  font-size: 1rem;
}
h6 {
  font-size: 0.875px;
  font-size: 0.875rem;
}
4

1 に答える 1

2

サイズ単位の比較は次のとおりです: http://www.narga.net/understanding-font-sizing-in-css-em-px-pt-percent-rem/

これにより、正しい方向に向けられるはずです。

于 2013-07-10T09:07:09.757 に答える