CSSスタイルセレクター

高洛峰
リリース: 2017-02-14 15:04:32
オリジナル
1727 人が閲覧しました

cssとは英語のCascading Style Sheetsの略で、カスケードスタイルシートと呼ばれ、ページを美しくするために使われます。

要素インライン、ページ埋め込み、外部導入の3つの存在方法があります。 3 つの方法の長所と短所を比較してください。

構文: style='key1:value;key2:value2;'

タグ内で style='xx:xxx;' を使用します

ページに埋め込む: を埋め込みます。ページの のコード ブロックを追加してから、次のコードは繰り返し呼び出すことができます


3. 外部 CSS ファイルを導入します

カスタム CSS スタイルを参照する必要がある HTML ファイルが複数ある場合、2 番目の方法に従って、各 HTML でスタイルを定義する必要がありますこの問題を解決するには、ファイルを定義し、カスタム スタイルを記述し、そのファイルからこのスタイルを呼び出すことができます。

styleの書き方:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/css"; charset="UTF-8">
    <title>页面一</title>
    <link rel="stylesheet" href="commom.css" />
    <style>
        .logo{
            background-color:red;
        }
    </style>
</head>
<body>
    <div class=&#39;logo&#39;>123456</div>
    <div class=&#39;logo&#39;>aaa</div>
</body>
</html>
ログイン後にコピー

1. クラスセレクター

.logoがclass='logo'を意味する場合、idセレクター

#logoはid='logoを意味します。 ' 、このスタイルを参照します


3. 組み合わせセレクター セレクター

a、div はすべての a タグと div タグがこのスタイルを参照することを意味します


4. アソシエーション セレクター

a div は階層関係を意味します、つまり、a タグの下にあるすべての div タグがこのスタイルを適用します。


5. 属性セレクター

input[type='text']、タイプ「text」のすべてのタグがこのスタイルを参照することを示します


6。 logo p は class='logo' を意味し、以下のすべての a タグと、class='logo' の場合の下のすべての p タグはこのスタイルを参照します


CSS スタイル セレクター関連の記事については、PHP 中国語 Web サイトに注目してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート