CSS複合スタイルの作り方

藏色散人
リリース: 2023-01-03 09:23:35
オリジナル
3526 人が閲覧しました

CSS複合スタイルの記述方法はスペースを利用することで実現されており、「背景、枠線」のように順序を気にする必要のない複合記述方法もあれば、順序を気にする必要があるものもあります。 「フォント」として。

CSS複合スタイルの作り方

#この記事の動作環境: Windows7 システム、css3 バージョン、DELL G3 コンピューター。

CSS 複合スタイル

1 つの CSS プロパティは、単一スタイルと呼ばれる 1 つのスタイルのみを制御します。

1 つの CSS プロパティで複数のスタイルを制御します。これを複合スタイルと呼びます。

複合書式

複合書式はスペースを使用して実現されます。複合書き込みメソッドの中には、背景や境界線などの順序を気にする必要がないものもありますが、フォントなどの順序を気にする必要があるものもあります。

1、backgroud :red url() repeat 0 0;
2、border:1px red solid;
3、font:
ログイン後にコピー

注: 少なくとも 2 つの値が必要です: size family

weight style size family
style weight size family
weight style size/line-height family
ログイン後にコピー

注: これらを混合しないようにしてください。混合する必要がある場合は、最初に複合スタイルを記述してから、単一のスタイルを書きます。

おすすめ: 「

css ビデオ チュートリアル

練習

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>CSS复合样式</title>
    <style>
        div {
            width: 300px;
            height: 300px;
            background: greenyellow url("img/gougou.jpg") no-repeat center center;
            border: dashed 2px blue;
            font:  bold italic 30px/50px 宋体;
        }
    </style>
</head>
<body>
<div>
    MW
</div>
</body>
</html>
ログイン後にコピー

レンダリング

CSS複合スタイルの作り方

以上がCSS複合スタイルの作り方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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