Web ページ レイアウト チュートリアル: CSS Web ページ レイアウト プロパティの概要

レイアウトチュートリアルのサンプルなので、レイアウトの詳細についてはあまり時間をかけませんでしたが、CSSを知っている人はダウンロードしてより詳細なアートになると思います。 CSS をより深く習得するという目的を達成するために、属性の特性をより鮮明に把握するために、属性パラメータを変更および変更するためにダウンロードできます。 実際、CSSは本当に難しいのでしょうか？ レイアウトチュートリアルのサンプルなので、レイアウトの詳細にはあまり時間をかけませんでしたが、CSSを知っている人はダウンロードしてより詳細なアートを作成できると思います。 CSS をより深く習得するという目的を達成するために、属性の特性をより鮮明に把握するために、属性パラメータを変更および修正するためにダウンロードするのに最適な Web ページです。


CSS を学ぶのは本当に難しいですか? 実際、それを習得するための経験が足りないだけです。でも、あまり効果的ではないかもしれません。経験者としては、何かを覚えるのは難しいですが、最初に本質を習得することができるので、これらの属性はより優れていると思います。当然のことながら、自分自身のニーズを満たすには十分ではなく、知識欲を引き起こし、自動的に他の関連属性に拡張して CSS を自然に習得し、理解を深めます。これは私が思う方法です（残念ながら、私が学んでいるときに誰かがこれを教えてくれたら、もっと遠回りをせずに済んだでしょう）。これは私の初めての執筆経験であり、言語体系に不備があるかもしれないので、それを含めてネチズンにお願いしたいのですが、将来的には経験を積んでより良く書けるようになると思います。以下は私の経験の一部と、必要だと思われる概念的な説明です。共有できる経験がある場合は、一緒に議論するためにコメントを残してください。

現在の Web テクノロジーでは、CSS+p が主流の Web サイト標準になっており、(Web 標準) と呼ぶことができます。 CSSとは英語でCascading Style Sheetsの略称で、HTMLやXMLなどのファイル形式を表現するために使用されるコンピュータ言語です。

CSSを理解して学習する前に、まずこのコンピューター言語が私たちにとってどのような利点と利便性を持っているのかを理解する必要があります。これを理解することは、非常に基本的ですが必要なことでもあり、CSS+pを学習する目的を明確にするのに役立ちます。スクリプトハウスは、ウェブサイト技術とデザイナーの経験を組み合わせ、ネットワークアプリケーションの観点から、CSS+pウェブサイトデザインの利点と問題点を次のようにまとめています:

まず、CSSの大きな利点は、簡潔なコードにあります。大規模な Web サイトの場合、帯域幅を大幅に節約できます (本当の意味は、Web 標準を使用して作成された Web サイトには、検索エンジンとしての利点があります)。フレンドリー; プログラムと Web ページ アートの観点からは、両方を独立させることができ、作業負荷を軽減し、重い開発を避けるために組み合わせることができます。

第二に、CSS+pで制作されたウェブサイトでは、多くの問題がプログラムを変更せずにCSSを変更するだけで済むため、ウェブサイトの修正コストが削減され、時間が大幅に節約されます。私は開発室の同僚たちと同様のプロジェクト事例に取り組んだことがありますが、同僚たちは多かれ少なかれこれの実際的な利便性を認識していると思います。

最後の点は、私が初めてこれに触れたとき、テーブルの方が位置を制御しやすく、p を使って書くことに抵抗があるのではないかと感じました。ウェブページのレイアウト。実際、これは適応プロセスであり、多くの実践的な操作と演習を通じて重要なポイントを理解することができます。その後、ページのレイアウトが異なれば、レイアウトの書き方も異なる可能性がありますが、どのように記述しても、コードは 1 つの原則に従います。つまり、定義された名前は次のとおりです。可能な限り普遍的な性質、つまり、より多くのボックスモールドを定義するために最小限のコードを使用することを私は呼びます (1 人で複数の用途を持つ) 他の設計者が理解し、使用しやすいように、名前付けは標準化され、組み合わせられる必要があります。もう 1 つは、ID を使用するか、Class を使用するかについてです。これについては多くの人が混乱するかもしれません。実際、これは相対的なものですが、今の私の執筆習慣は主にクラスを使用することになっており、これがより便利で私の執筆習慣に適していると思います。

以下は、PHP 中国語 Web サイトが最初に理解して習得する必要があると考えられる、一般的に使用される基本的な属性です:

CSS で理解して習得する必要がある重要な属性:

マージン: auto | length 浮動小数点数で構成される長さの値ポイント番号とユニット識別子|パーセンテージは親オブジェクトの高さに基づいています。インライン オブジェクトの場合、左右の外側のマージンは負の値になる可能性があります。

パディング: 長さは、浮動小数点数と単位識別子またはパーセンテージで構成される長さの値です。パーセンテージは親オブジェクトの幅に基づいています。

Float: none | left |right これは、レイアウトを定義する際に使用する必要がある属性です。これを使用する場合は、配置とブラウザーの互換性の問題に注意を払う必要があり、多くの実践でそれについて詳しく学ぶ必要があります。このプロパティ。この属性を持たせるには、次のサポート属性を理解する必要があります。「clear」

: none | left | right 両方; 両方でフローティング オブジェクトを許可しません。左側、右側 右側には浮遊物は許可されません。

背景:url(images/aardvark.gif) left top no-repeat |repeat-x |repeat-y レイアウトを美しくするために背景画像を定義することも非常に一般的に使用される属性です。

overflow: 表示 | 自動 | 非表示 | スクロール 私は通常、ブラウザの互換性の問題を防止および解決するためにこの関数を使用します

border:1px Solid #CCCCC これは、境界線のサイズ、線、および色を定義する属性です。

list-style-image list-style-position list-stle-type このリスト属性は通常、順序付きリストと順序なしリストで使用され、Web ページのタイトル インデックス テキスト リンクの定義によく使用されます。 . 表の代表格。

上記は、CSS を学習する際に覚えて理解する必要があるとスクリプトハウスが考える CSS 属性です。その特性を完全に理解することで、アプリケーションのレイアウトの自由度が大幅に高まります。したがって、上記のスタイルをマスターすると、以前は理解できずにページを作成するときに無能だと感じていたことも、マスターすると自然にレイアウトを実現できるようになります。自分の論理的思考に基づいて好みのレイアウトを作成すると、CSS耐性が大幅に軽減されます。

そう言えば、よくある質問をしたいのですが。 WEB 標準がすべてのテーブルで p を使用することを禁止しているわけではないと思います。私も最初はこのような間違った考えを持っていましたが、「標準」についての私の理解は、標準の設計者が適切な記述習慣を身につけ、主流の統一を達成するというものでした。 Web ページの機能実装という点ではテーブルの方が依然として p よりも優れている場合があり、p を無制限に使いすぎると IE の解析が消費され、CPU の負荷が増加します。これも我々が注目すべき問題である。

上記の一般的に使用される属性をマスターしながら、以下は Design Ming がインターネット ブログに書いた CSS の 3 列レイアウト テンプレートです。主に CSS の本質をマスターし、Web ページ レイアウト チュートリアルのサンプル テンプレートを学ぶ方法に焦点を当てています。ネチズンは記事の内容に従ってこのテンプレートをダウンロードして、テクノロジーを理解して習得することができます。このテンプレートは、上記の重要な CSS プロパティをカバーするために当社のサイトによってコンパイルされました。

レイアウトのチュートリアルのサンプルなので、レイアウトの詳細については詳しく説明しませんでしたが、CSS を知っている人はダウンロードしてみると良いと思います。 CSS をより深く習得するという目的を達成するために、属性の特性をより鮮明に把握するために、属性パラメータを変更および修正するためにダウンロードすることができます。

以上がWeb ページ レイアウト チュートリアル: CSS Web ページ レイアウト プロパティの概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。