CSSスタイルセレクター-CSSチュートリアル-php.cn

CSSスタイルセレクター

高洛峰

リリース： 2017-02-14 15:04:32

オリジナル

1718 人が閲覧しました

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 サイトに注目してください。