5

emと混ぜるべきですpxか?

Asemはフォント サイズにpx基づいており、画面に基づいています。

ですから、ほとんどの Web サイトが を使用しているときに画像を生成するにはどうすればよいのemでしょうか?

4

7 に答える 7

3

通常、画像にはピクセル単位の固有の寸法があります。ただし、テキストのサイズと一致する必要があるボタンなどの場合は、フォント サイズに応じてサイズを変更できます。十分な大きさの画像を作成し (拡大するよりも縮小する方がはるかに効果的です)、たとえば画像の高さを に設定し1.5emます。高さのみを設定して幅を設定しない場合 (またはその逆)、ブラウザは幅と高さの比率が維持されるように画像をスケーリングします。

ただし、ボタンは画像ではなく CSS を使用して作成することをお勧めします。背景画像は、高度な CSS 機能 ( ) を使用して拡大縮小できますがbackground-size、ブラウザのサポートは限られています。

于 2012-10-06T08:45:10.767 に答える
3

1em は現在のフォント サイズと同じです。2em は、現在のフォントのサイズの 2 倍を意味します。たとえば、要素が 12 pt のフォントで表示される場合、「2em」は 24 pt です。「em」は、読者が使用するフォントに自動的に適応できるため、CSS の非常に便利な単位です。

「em」単位は、それが使用されている要素の「font-size」プロパティの計算値と同じです。例外は、'font-size' プロパティ自体の値に 'em' が含まれている場合です。この場合、親要素のフォント サイズを参照します。垂直または水平の測定に使用できます

ピクセル (コンピューター画面上のドット)、px は IE でもサイズ変更できます。em は、親要素によって継承されたサイズに対する相対サイズであり、実際には % と同じ意味を持ちます。

于 2012-10-09T07:43:37.440 に答える
2

フォントは、さまざまなサイズで使用できるように設計されています。したがって、フォントエンジンは、正確にスケールアップ/スケールダウンするのに問題はありません。ただし、画像は常に厳密な測定を使用しています(単位に関係なく)。その結果、それらのサイズを変更すると、それらが大きくなる傾向があります。これは、ブラウザがサイズ変更を行っている場合に特に当てはまります。ブラウザは写真編集ツールとして設計されていません。

画像ベースのメニューを作成していて、メニューのサイズを拡大できるようにしている場合は、再設計が必要な場合があります。再設計ではない場合、おそらく1つの要素(スケーリングなし、または画像なし)を排除するよりも。

于 2012-10-09T15:13:35.453 に答える
2

フォントに関しては、html、body、および em で px を使用するのが常に最善だと思います。ただし、相対単位 (vw vh v-min v-max) を見てください: http://css-tricks.com/viewport-sized-typography/

于 2012-10-10T20:52:43.253 に答える
2

私は個人的に両方を混ぜます。エラーなしでどちらの方法でも実行できます。
それは好みと習慣に依存します。他にもあります: http://www.w3schools.com/cssref/css_units.asp

于 2012-10-10T08:29:57.077 に答える
2

混ぜることはできますが、お勧めしません。親が em を使用している場合は、コンテナー要素を作成し、その要素で px を使用します。

于 2012-10-06T06:40:50.507 に答える
1

css3 を使用する

background-size: auto 100%;

コンテンツのコンテナに。どのように設定されていても、背景はコンテナーの高さに応じてサイズ変更され、コンテナーの高さは font-size に応じて増加します。

于 2012-10-11T17:04:26.093 に答える