ういすぷのブログ

ういすぷの記録帳

• ブログへ戻る
• タグ一覧
• ブログ一覧

• 
  background-image で比率を維持しながらレスポンシブ表示させる。
  
  
  ボックスのサイズ比率を維持しながら、背景に画像をいれ、その背景画像の比率も維持するためのCSSです。これによりレスポンシブなサイトを作る上で、背景画像を入れたボタンなどを作るときに便利になります。画像を使ったボタンや、PCやスマホ向けに画像を切り替える場合など、CSSだけで処理できるので便利です。やり方：高さを0px指定し、padding-topに比率を入れます。padding-topの値は、「横 [...]
  • レスポンシブ
  • HTML
  • CSS
  • ボックス
  • 背景
  • 比率
  2016.09.06
• 
  スマートフォンやタブレットでも見られるように、デザインを変更してみました。
  
  
  最近話題の「レスポンシブ Web デザイン(Responsive Web Design」と言う感じで、スマートフォンやタブレット、PCでも同一HTMLをCSSを切り替えることで表示出来るようにしてみました。厳密なレスポンシブデザインとまではいきませんが、ちゃんとリンクはクリック出来るようにしました。ただし、テスト端末が少ないため、うまいこと表示出来るかは疑問だったりします。また、METAタグで携帯 [...]
  • WebBoard
  • スキン
  • レスポンシブ
  • Responsive
  2013.10.16