ページ要素の絶対位置と相対位置に関するある程度の理解

今日から、定期的にちょっとした豆知識を整理していきます。簡単なものもあるかもしれませんが、どれも役に立つはずです。

div の絶対配置と相対配置については、フロントエンド IT 担当者なら誰でも使うものです。いわゆる絶対配置とは、このものがそこにあり、他のものがどう動いても自分の位置は変わらないというものです。これを優しく言えば整合性といいますが、はっきり言えば不正といいます。もちろん、相対的な位置決めには絶対的な位置決めが一般的に使用されます。これはギャングがみかじめ料を徴収するのと似ています。このエリアは私の管轄下にあり、私の中の要素の位置はすべて私のものであり、外の世界とは何の関係もありません。絶対的な配置について説明した後は、相対的な配置について説明しましょう。この属性を持つ要素は非常に無骨です。リーダーが行くところならどこへでも行き、常にリーダーの周りを回ります。さて、話はこれくらいにして、本題に戻りましょう。

場合によっては、レイヤーに何かを追加する必要がありますが、PS の場合ほど Web ページに追加するのが容易ではありません。レイヤーのコンテンツを格納するための div (またはその他のコンテナー) を記述し、それを配置したいレイヤー (div) に配置し、親レイヤーのスタイル属性の位置を絶対に設定し、最後に新しく作成した div のスタイルの位置を相対に設定する必要があります。こうすることで、レイヤーが親レイヤーの上に配置されます。サブレイヤーには上、下、左、右のプロパティがあり、要素を上、下、左、右に配置できます。

注意すべき点の 1 つは、絶対配置レイヤーを定義しない場合、相対配置はページ全体に対して相対的になるということです。よく使用されるプロトタイピングソフトウェアである Axure RP は、グローバルな相対配置を使用します。実際、Axure RP は非常に使いやすいです。

だんだん涼しくなってきましたので、暖かくしてお過ごしください。

<<: el-table カプセル化に基づくドラッグ可能な行と列、および選択列コンポーネントの実装

>>: この記事ではCSSの組み合わせセレクターの使い方を説明します