CSS の配置に関する 10 のコースの推奨事項

はじめに インターネット上で最も一般的な解決策の 1 つは、親要素で相対を使用し、次に子要素で絶対を使用することです。このソリューションは確かに優れていますが、欠点の 1 つは、複数の場所で使用すると、このようなカスケードおよびネストされた関係が非常に混乱することです。この記事では、その解決策を一時的に放棄し、いくつかの CSS 背景画像配置ソリューションを紹介します。 1. 依存関係のない絶対配置 インターネット上では、絶対配置について誤解があります。絶対配置を使用すると、親要素の相対配置が相対的に設定される必要があると考えられています。この理解は間違っているとは言えず、定義が完全に理解されていないとしか言​​えません。絶対位置は、W3C ドキュメントで次のように定義されています。絶対位置の要素を生成し、静的配置以外の最初の親要素を基準にして位置します。要素の位置は、「left」、「right」、「bottom」、および「top」属性によって指定されます。この文の理解は次のようになります (L: 左、R: ri

1. CSSを使用して背景画像を配置する一般的な方法のまとめ

はじめに: 最も一般的な方法インターネット上での解決策の 1 つは、親要素で相対化し、次に子要素で絶対化することです。この解決策は確かに優れていますが、欠点の 1 つは、このような要素を複数の場所で使用すると、要素の階層関係が変化してしまうことです。この記事では、その解決策を一時的に放棄し、いくつかの CSS 背景画像配置ソリューションを紹介します。

はじめに: これらの小さな画像は、画像全体を分割した後の部分であり、各部分は個別の画像として保存されるのではなく、1 つの画像上に配置されます。その目的は、画像の数を減らすことであることは誰もが知っています。 http リクエスト。時間と帯域幅を節約します。それでは、画像の一部だけをさまざまな場所に表示する方法について説明します。これは、今日説明する背景画像の位置の問題を使用するものです。友人が私に尋ねてきたので、今日はそれについて体系的に説明します:

3. CSS 位置決めの使用の概要

はじめに: この記事では、 CSS 位置決めの使用の概要

4

CSS を使用してウォーターフォール フローを位置決めする、簡単な実装コード

はじめに: この記事では、CSS を使用してウォーターフォール フローを位置決めする、簡単な実装を紹介します。コード

5.

CSS の 3 つの配置ルーチン、固定、絶対配置の詳細な紹介

はじめに: この記事では、3 つの CSS 配置ルーチン、固定配置、および絶対配置について詳しく説明します

6.

CSS の位​​置決めテクニック

はじめに: この記事では主に CSS の位​​置決めの一般的なテクニックについて説明します。CSS の位​​置やその他の属性については、実際に慎重に考慮する必要があることがたくさんあります。この記事では、あなたと一緒にそれを探っていきます

7.

誕生日ケーキを作るための純粋な HTML5 + CSS3 (コードは理解しやすいです)

はじめに: 早速、レンダリングをお見せします。ケーキは、下のケーキ、上のケーキ、キャンドルの部分の 3 つの部分に分かれています。 HTML のレイアウト構造もこの 3 つの部分に従ってレイアウトされます。もう 1 つは、CSS の位​​置決めと CSS3 の回転、内側と外側のシャドウ、その他の効果を使用して、一部の DOM 要素のスタイルを調整することです。これは比較的単純なので、すべてのプログラマーは理解していると思います。他のものについては詳しくは説明しません。完全な HTML コードと CSS コードは以下に示されています<

8. CSS BFC (ブロック フォーマット コンテキスト)

はじめに: 以前は BFC が何なのか知りませんでしたが、今日はそれを読んで、私は以前から頻繁に連絡を取っていたことに気づきましたが、専門家の名前を知りませんでした。クロージャや継承と同じように、以前はよく使われていましたが、私は知らなかったので、今日は CSS の位​​置決めの BFC について説明します。

9. CSS の Z インデックスの位置決めの問題

はじめに: CSS の Z インデックスの位置決めの問題

10.

はじめに: CSS の配置

[関連する Q&A の推奨事項]:

html - CSS の配置 WeChat の下に赤いメッセージを実現する方法 さまざまな携帯電話の幅の下に赤いメッセージを配置する方法

以上がCSS の配置に関する 10 のコースの推奨事項の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。