ホームページ  >  記事  >  ウェブフロントエンド  >  CSS スタイルのネスト方式を使用した Dreamweaver の Web ページ制作

CSS スタイルのネスト方式を使用した Dreamweaver の Web ページ制作

小云云
小云云オリジナル
2018-01-04 16:51:563716ブラウズ

Dreamweaver で Web ページをデザインするときに、CSS スタイルのネストを使用したいと考えています。Dreamweaver の Web ページ制作で CSS スタイルのネストを使用するにはどうすればよいですか?作り方は?以下の詳細なチュートリアルを見てみましょう。必要な方はぜひ参考にしてください。

1. ソフトウェアを開き、2 つの段落のテキストを入力します。

2. 最初のテキストの ID を設定します。たとえば、ID は CSS です。

3. 2 つの 段落のテキストで、中央の 2 つの単語をランダムに選択し、 に下線を引きます。これにより入れ子が形成されます。つまり、段落要素の下に下線付きの要素が存在します。

4. css スタイルを下線要素に追加し、 CSS スタイル ウィンドウを開いて、[新しい css ルール] をクリックします。

5. ポップアップダイアログボックスで、要素 として タイプを選択し、em としてセレクター要素を選択します。

6. ポップアップ CSS ルール定義ウィンドウ で、属性を選択します (例: テキストの色)。文字サイズは36pxです。 [OK] をクリックすると、下線付きの要素のフォントが変更されたことがわかります。

7. ただし、新しい CSS スタイルを作成するときに、セレクターの種類として 複合選択 を選択し、セレクター名が #css em である場合は、中央のスペースに注意してください。 。 CSSルールで定義されている文字サイズは36px、文字色は赤です。その結果、上記のテキストの下線付きの内容のみが変更されます。

上記は、Dreamweaver で CSS スタイルのネストを使用する方法です。引き続きスクリプト ホームに注目してください。

関連する推奨事項:

Dreamweaver の画像トリミング技術の詳細な説明

Dreamweaver Web ページで CSS スタイルの複合ステートメントを作成するには?_Dreamweaver チュートリアル_Web ページ制作

Dreamweaver Web ページのジャンプ メニュー

以上がCSS スタイルのネスト方式を使用した Dreamweaver の Web ページ制作の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。