タグ

2020年10月15日のブックマーク (1件)

  • 絶対配置をレスポンシブしたいとき。

    キービジュアルのところとか、デザインによっては、要素を絶対配置してアニメーションしたい時とか。デスクトップのデザインとモバイルのデザインはあるけれど、タブレットのデザインがない時とか。デスクトップのレイアウトのまま、タブレットサイズに収めたい時とか。そんな時に応急措置として使えるレシピ。 要素を絶対配置したいときとは 一枚絵だけれど、イラストひとつひとつを順番に表示させたい、というようなとき。 単純にピクセル値で絶対配置しちゃうと、下サンプルみたく、横幅の狭いタブレット端末などで、横スクロールバーが出ちゃうし、背景途切れちゃうし、格好悪いですね:(。 画面サイズに合わせて伸縮したい 例えば、「ウィンドウの横幅が1200px以下の時にはウィンドウ幅いっぱいのまま伸縮させたい」ような場合、ウィンドウ幅が1200px以下の時の要素の幅をvwで表すと「100vw(=横幅いっぱい)」になります。 と

    絶対配置をレスポンシブしたいとき。