[JS]複数行の異なる高さのブロックをそれぞれ同じ高さに揃えるスクリプト
画像のサムネイルやテキストを配置したボックスなど、異なる高さのブロックが数多くあっても全ての高さを等しく揃えるスクリプトを紹介します。 Equal Height Blocks in Rows 一行目と二行目では、違う高さで揃えていることに注目してください。 [ad#ad-2] デモでは異なる高さのブロック（スクリプトオフ時）が、スクリプトによって行ごとに同じ高さに等しく揃えています。 デモページ 実装のアイデアとなったのは、「Making DIVs, using the CSS "Float Left" property...」とのことで、そのdiv要素がどの横列に属しているか調べ、その中で一番高いものに揃えています。 [ad#ad-2] 実装方法 HTML 画像やテキストを配置できるdiv要素を使用しています。 <div id="page-wrap"> <div></div> <div>
ウェブデザインにおけるネガティブスペースの活用ガイド
ネガティブスペースを巧みにつかったウェブサイトの紹介をはじめ、ウェブページのレイアウトでどのように分析し改善するのか、効果的に活用するガイドをSix Revisionsから紹介します。 Negative Space in Webpage Layouts: A Guide 下記は、各ポイントを意訳したものです。 はじめに ネガティブスペースとは ネガティブスペースの重要性 ネガティブスペースを実例から学ぶ まずはデザインの単純化から ネガティブスペースを分析、そして改善 ネガティブスペースの活用例 おわりに はじめに ネガティブスペースは多くの場合、ミニマリズムのようにシンプルを美とした特定のデザインだけのものであると誤解されています。本来ネガティブスペースというものは、あらゆるデザインにおいて注意を払い、そして慎重に組み立てて使用すべきものです。 ここではネガティブスペースが何であるか、そ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
