タグ

HTMLとresponsiveに関するsh19eのブックマーク (2)

  • アイコンの実装方法

    ウェブページにおけるアイコンの実装方法はさまざまです。マークアップに img 要素を配置する方法もあるし、CSS から背景画像やアイコン・フォントを使う方法もあります。そういった中からどの方法を採用すべきかを判断するには、HTML Standard の Requirements for providing text to act as an alternative for images にあるとおり、「そのアイコンの意味を伝えるテキストが付随するかどうか」を考える必要があります。 テキストが付随しないアイコン 家のアイコンだけでホームページへのリンクを表す場合など、ラベルとしてのテキストが存在しないアイコンは、自分自身でその意味を伝える必要があります。こういったアイコンの実装方法は限られていて、ほぼ 1 つしかありません。alt 属性に代替テキストとしてラベルを指定した img 要素をマー

    アイコンの実装方法
  • HTML の br タグを CSS だけで消す方法

    HTML に br という要素がありますね。 4.6 Text-level semantics — HTML5 The br element represents a line break. ということで、改行を表すということになってます。 以前は <br /> が不要なら <br /> を入れなきゃいいじゃない というだけの話だったんだけど、 最近これを有効にしたり無効にしたりと切り替えたくなることがあります。 例えばいわゆるレスポンシブデザインでサイトを組むときに 大きな画面なら表示範囲にゆとりがあるから改行を入れて広く使ってもいいけど スマートフォンなどの画面でそれをやると一目に入る情報量が減っちゃうから そのときだけ br をなかったことにしたいという具合に。 考えたこともやったこともなかったんだけど、 これ実に簡単な話でした。 display: none; にする 要するに br

    HTML の br タグを CSS だけで消す方法
  • 1