ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSスタイルシートとは何ですか? CSSスタイルシートの例を詳しく解説
CSSスタイルシートとは何ですか? CSSスタイルシートの例を詳しく解説
- 零下一度オリジナル
- 2017-06-16 14:52:323070ブラウズ
スタイルシートとは
CSSとはCascading Style Sheetの略です。 「カスケード スタイル シート」と訳されます。 Web ページのスタイルを (拡張) 制御し、Web コンテンツからスタイル情報を分離できるようにするために使用されるマークアップ言語です。
Webページにスタイルシートを追加する方法
次の3つの方法でWebページにスタイルシートを追加できます。ターゲットに最も近いスタイル定義が優先されます。優先度の高いスタイルは、優先度の低いスタイルの重複しない定義を継承しますが、重複する定義をオーバーライドします。例外については重要な宣言を参照してください。
スタイル シートへのリンク
最初に外部スタイル シート ファイル (.css) を作成してから、HTML リンク オブジェクトを使用できます。例は次のとおりです。
<head> <title>title of article</title> <link rel=stylesheet href="www.dhtmlet.com/rainer.css" type="text/css"> </head>
XML では、次のように宣言領域に追加する必要があります。
<? xml-stylesheet type="text/css" href="www.dhtmlet.com/rainer.css" ?>>
内部スタイル ブロック オブジェクトを定義します (スタイル ブロックの埋め込み)
15fd3d7170da02e89efd16e24a1c4889...a2d87b9af1e305217ec9648d1e8a0a47 タグを HTML> タグと a64997a0904a094b4570728d7f327acd の間に挿入します。 定義方法については、スタイルシートの構文を参照してください。例は次のとおりです。
<html>
<style type="text/css">
<!--
body {font: 10pt "Arial"}
h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon}
h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue}
p {font: 10pt/12pt "Arial"; color: black}
-->
</style>
<body>ここでスタイル オブジェクトの type 属性を "text/css" に設定すると、このタイプをサポートしていないブラウザはスタイル シートを無視できることに注意してください。
インライン スタイル
インライン定義では、オブジェクトのマークアップ内でオブジェクトの style 属性を使用して、それに適用されるスタイル シート属性を定義します。例は次のとおりです。
<p style="margin-left: 0.5in; margin-right:0.5in">这一行被增加了左右的外补丁<p>
スタイルシートの構文 (CSS 構文)
Selector { property: value }
パラメータの説明:
Selector -- セレクター
property : value -- スタイルシート定義。プロパティとプロパティ値はコロン (:) で区切られます。定義はセミコロン (;) で区切られています
「継承」値
各プロパティには、指定された値 (Inherit) があります。これは、親オブジェクトの値をコンピュータの値と同等にすることを意味します。この値は通常、バックアップとしてのみ使用できます。明示的に宣言すると、強調するために使用できます。
CSSとはCascading Style Sheetの略です。カスケード スタイル シート、結合スタイル シートなどを翻訳します。
例を挙げてみましょう。たとえば、テーブルや div は家の構成要素であり、Web サイト全体のフレームワークを設定するために使用されます。 CSS は家の装飾です。洗練されていないウェブサイトは見苦しいです。
私たちは通常、ウェブサイトの色やテキストなどを変更するためにCSSを使用します。
CSS についてもっと知りたい場合は、オンラインで検索できます。オンラインにはたくさんあります。私の実践からお伝えしているだけです。最後に、スタイルとフレームワークは切り離せないものであると言いたいだけです。
以上がCSSスタイルシートとは何ですか? CSSスタイルシートの例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。