1

このウェブサイトhttp://www.elkaniho.com/には、私が望む CSS レイアウトがあります。ご覧のとおり、正確なグリッドではなく、下部と側面に div が重なり合っています。

ブラウザのサイズを変更すると、すべてが完全に再調整されますか?

elkaniho.com のように同じレイアウトを取得する方法や、これがどのタイプのレイアウトと呼ばれているか知っている人はいますか?

4

3 に答える 3

2

Masonryと呼ばれる jQuery プラグインもあります。これは、さまざまな幅の div を処理し、それらを可能な限り密に積み重ねることができます。内容によります。

于 2010-04-06T01:40:38.103 に答える
1

これは 6 列のレイアウトです。6 つの div で簡単に実行できます。

<div id="container">
  <div class="column">one</div>
  ...
  <div class="column">six</div>
</div>

流動的なレイアウトとして:

#container { overflow: auto; }
div.column { width: 16%; float: left; }

もちろん、幅も固定できます。

各列には、div (および実際にはすべてのブロック要素) が行うことを行ういくつかの div があります。それらは上から下に積み重ねられます。

于 2010-04-06T01:37:14.057 に答える
0

あなたが話している効果は、JavaScriptを使用して作成されます。ソース コードを見ると、この効果を担う cajas および cajasInterior と呼ばれる関数を含む funciones.js と呼ばれる JavaScript ファイルへのリンクが見つかります。また、jQuery を使用していることにも注意してください。

機能:

  1. 本文幅、ボックス幅、余白から最大段数を割り出す
  2. box および boxInterior のクラスを持つすべての div を絶対位置に設定し、それらの幅を設定します
  3. 各ボックスを通過し、左と上の位置を計算します。

サイトのウェブマスターに連絡して、このスクリプトを使用し、ニーズに合わせて変更する許可を求めます。

于 2010-04-06T01:51:00.987 に答える