画像定義の問題について_html/css_WEB-ITnose

今日のテストで、タイトル バーのアイコンが不鮮明であるというバグが発生したので、修正を提案しました。

タイトルの全体の高さから、タイトル バーに南京工科大学の学校のロゴがあります。バーは 36PX、

そのままにします アーティストは背景が透明な 32X32 NTU アイコンを提供しましたが、結果はあまり鮮明ではありませんでした

幅と高さを設定して、元の 700X700 の不透明な元の画像を使用しました。 IMG の属性では、

サイズが 32X32 として表示されました。32X32 を直接使用した画像よりも鮮明であることがわかりました。

しかし、このファイルは 1M を超えており、そのような大きな画像を画面に表示するには適していません。 Web ページ

そこで、PS を使用して 128X128 サイズに調整し、背景色を透明に設定しました

プロジェクトに配置した後、表示効果は前の 32X32 よりもはるかに優れています

要約すると、次のようになります。 32X32 サイズの画像を直接使用すると、一部の詳細が圧縮されるため、鮮明さが失われます。

サイズの 4 倍の画像を使用し、高さと幅の属性を設定してサイズを制御すると、鮮明さを効果的に維持できます。画像と写真は大きすぎないようにします。