CSSでは画像の幅寸法を変更することもできます

1012 ワード

一般的には、タグの画像のみ、幅の高さ設定に応じてサイズを変更することができます.
例えば1024 x 768の図では、width=“640”、height=“480”を設定すると、640 x 480が表示されます.
不必要なデータ転送を避けるために,かえって非実際のサイズのピクチャの読み取りを提唱しないことが多い.
しかし、この世界には固定サイズで実際には多くの画像を読み取る必要がある場合があるとは思わなかった.
画面表示のDPIを増やすためです.
Smart phoneサイトを作るときは、Retinaはもちろん、高画質の画面では高解像度の画像を読み取る必要があります.そうしないと、ぼんやりしてしまいます.
カラー写真とは異なり、一部の色は単一だがフォントが特殊なボタン、タイトルなどは、かえって画像の品質に高い要求がある.
PSではベクトル編集能力があれば、これらの画像を拡大して高解像度の画像を作り、モバイル機器の画面サイズに適応させることで、高密度画素表示効果を得ることができる不二法門です.
PSの画像サイズでDPIを上げてみましたが、いくらアップしても、小さいサイズの画像にしても、まだ効果がありません.そのDPIは虚構なのでしょうか.
一部のボタンはの方法で作ることができ、は便利に適応することができます.
でもどうすればいいの?
CSSを背景にするしかありません.
CSSが幅の大きい画像を固定サイズに圧縮できず、局所表示だけを削ると、この問題は解決できません.
幸いなことに、CSS 3はこのような能力を備えています.
background:url(../images/uploadbtn.png) center no-repeat #ff1300; background-size:296px 55px; 
background-size:     500x93       ,   296x55。

これにより、のようなラベルにかかわらず、大図で高画素密度の小図を表示することが可能となる.