htmlでドックパネルを作成する最も良い方法は何ですか？

Question

私はhtmlでドックパネルをシミュレートしようとしています。たとえば、上部にdivをドッキングし、残りのスペースにdivを入れたいとします。ブラウザウィンドウのサイズを変更すると、divのサイズも変更されます。

私はこれを達成するための多くの複雑な方法を考えることができます。

これを行うにはシンプルでエレガントな方法がありますか？

Answer 1

あなたが与えた限られた情報に基づいて、これを行う方法はいくつかあります。基本：

が、これはあなたのdiv要素であると言うことができます：今

<div id="dock"> 
You can put anything you want here. 
</div> 

は、CSSでスタイルをすることができます。

#dock { 
position: fixed; 
top: 0; 
left: 0; 
right: 0; 
height: 50px; 
} 

"position：fixed;"スクロール中にdivが年齢とともに移動することを確認します。 "top：0; left：0; right：0;"ドックをページの上部に配置し、右から左に向かいます。ユーザーがページのサイズを変更すると、ドックは自動的にサイズ変更されます。ドックを下にしたい場合は、「上」を「下」に変更します。明らかに高さはdivの高さを示します。これはちょうどあなたの画面の上部に長方形を与えますが、それはウェブサイトやロゴなどのタイトルに使用することは良いことです。ドックのスタイルは、あなたがそれで何をしたいかによって異なります。特定の回答が必要な場合は、あなたの質問に特定のものが必要です。あなたの他のすべてのコンテンツについては、まあ、あなたはそれを体に置くことができ、それはすべて良いでしょう。