2017-04-17から1日間の記事一覧

画像のサイズが変わっても縦横比を変えずに枠に合わせて拡大させる

記事の一覧表示など、同じサイズの枠をたくさん並べる時に、画像のサイズでどんなものが来ても枠に合わせて取り繕ってくれる呪文を習ったので備忘メモ。 まず、表示するimageはspanでくくって、background-imageで画像を指定します。 <span class="クラス名" style="background-image:url(画像場所);" alt=""></span> こうすることのメリッ…

長いアルファベットやURLでも途中で改行する「word-wrap: break-word」

アルファベットの続きもじ(とくにURLなど)は、改行すべきところで改行してくれないことがあります。 そういう時は、bodyかhtmlに、「word-wrap: break-word」を指定すると、一発で改行されます。 簡単ですが、対応しておかないと後とレイアウトがずれるこ…