1

私はウェブサイトを持っています。Web サイトを可変グリッド レイアウトに変換できますか? これを自動化するツールはありますか、または (Dreamweaver で) 流体グリッドを作成し、<div>タグを挿入してスタイルを挿入する必要がありますか?最終的に私の Web サイトに似たものになります。

4

1 に答える 1

1

私が知っているツールで、流動的なグリッド レイアウトをすぐに既存のレイアウトに作成できるツールはありません。これはおそらく、そのようなツールでは、どの種類のグリッド構造を使用すべきかを判断するのが難しいという事実によるものです。グリッドを使用する場合、列のサイズは固定されているため、ピクセル単位で正確な CSS スタイルを使用して作成した CSS とは異なる場合があることに注意してください。

私がお勧めするのは、そこにある多くのフレームワークを見ることです。使い方はとても簡単で、div タグにクラス名を追加するだけです。

Fluid Grid フレームワークのリスト

それらはさらに100万ほどあります。手間をかけずに簡単に実装できるグリッド システムを探しているだけなら、Fluid960 を使用してください。

編集 次の構造があるとしましょう

<div style="width:100%">
 <div style="width:20%>First div</div>
 <div style="width:30%>Second div</div>
 <div style="width:50%>Third div</div>
</div>

16 グリッド 960 フレームワークの場合、16 列すべてとして 100% を取得する必要があります。したがって、20% (最初の div) は 3 グリッド列、30% は 5 グリッド列、50% は 8 グリッド列である必要があります。これで、3 + 5 + 8 = 16 列になりました。HTMLでは、書くだけで終わります

<div id="grid">
 <div class="grid_3"></div>
 <div class="grid_5"></div>
 <div class="grid_8"></div>
</div>

そして、あなたは完了です！

于 2012-11-09T09:06:04.980 に答える