横幅100%

昨日、深夜のリンガーハットでちゃんぽんをススりながら、iPhoneでマイブログのルックを確認してみたら、画像が盛大にハミ出しているのに、今さら気づく始末。

ブログのPCクライアント用のテンプレートが540px幅くらいなので「512px」固定で横幅を設定してたのですが、iPhone4Sの縦長表示だと、枠外に大きくハミ出してしまうようです(考えてみれば当然ですが‥‥)。一番新しいiPhoneだと問題ないかも知れませんが。

‥‥なので、端末の解像度に合わせて動的に横幅を変化させるように「100%」に書き換えました。ただまあ、横を100%で縦を比率相応にした場合、縦長の画像はかなりデカく表示されますが、ハミ出すよりはマシかと‥‥。

iPadでの表示は「width: 100%」だけでOKだったんですが、Kindle HDX(Silkブラウザ)だと縦を「auto」に明示してやらないと、画像がツブれてしまうようで、慌てて「style="width: 100%; height: auto;"」へと修正しました。

ちなみに、以前に掲載した4Kサンプル画像参考画像は、できれば4KモニタかiMac 5Kで見て頂きたい‥‥です。Webブラウザ上の表示でも、2K時代のソレとは細密感が大きく違います。画面が小さく高解像度のタブレット端末〜2KのiPad mini 2 or 3や2.5KのKindle Fire HDX 8.9〜でも、細密感を確認してもらえます。

しかし、なんてこった‥‥。2K〜2.5Kのひと昔前なら高解像度のPCモニタが、ゆるくボケて感じられる日がこんなにも早く来ようとは‥‥。自分のカラダの順応性にまず驚きます。4Kが世間に行き渡り始めたら、「皆、4Kの画質に簡単に馴れる」のは、確実です。

 

1

calendar

S M T W T F S
      1
2345678
9101112131415
16171819202122
23242526272829
30      
<< April 2017 >>

selected entries

categories

archives

links

profile

search this site.

others

mobile

qrcode

powered

無料ブログ作成サービス JUGEM