コース: CSS 基本講座
今すぐ登録して、23,200件以上登録されている、業界エキスパート指導のコースを受講しましょう。
CSSに宣言を複数加える
このレッスンでは CSSに宣言を複数加えてみたいと思います。 CSSの宣言の書き方なんですが、 まずはhead要素にstyle要素を定めます。 その中に書くわけですけれども まずはどの要素に CSSを適用するのかという指定ですね。 「セレクタ」を書きます。 そして宣言のブロックを作るんですが、 その中に「プロパティ」と それから「値」というこのセットが 宣言ということになります。 そしてその宣言はブロックの中に 複数書くことができますので 複数の宣言をしてみたいと思います。 このHTMLドキュメントにはすでに CSSの規則が書いてあるんですけれども h1 には文字色、color ですね。 それが blue と。 p要素には color は red。 li には color が green ということで 先ほど見たような文字のカラーの指定が できていたわけです。 今それぞれのセレクタ、 そして、そのあとにある｛｝ですね。 これが宣言ブロックというんですが、 ブロックの中には ひとつずつしか宣言がありませんけれども 複数書くことができます。 その場合、改行して 入力をするというのが通常です。 それが標準的な書き方ですね。 ここではそれでは今度はbackground。 background の color ということで、 clip になってますね。 コードコンプリートから background-color を選びました。 そして : のあとにcolorを指定するんですが ここは aqua にしましょうか。 aqua。 これ実は cyan という言い方もあります。 普通の画像編集ソフトなどですと cyanというのがよく使われますね。 実際カラーネームには cyan もあるんですけれども aquaのほうが標準だと思います。 ということでここは aqua にしておきます。 いわゆるカラーの16進数で言うと 00FFFF ですね。 この色です。 aqua にしておきましょう。 そうすると背景色にaqua、 いわゆるcyanとも言われたりするわけですが 水色がつくわけですね。 もうひとつ加えましょう。 また宣言を改行で加えて、 border と。 これは枠線です。 h1要素に枠線をつけるんですが、 いくつか指定する値があります。 まずは太さです。 ちょっと太めにしておきましょう。…
エクササイズファイルを使って実践してみましょう。
インストラクターがコースで使用しているファイルはダウンロードできます。見て、聞いて、練習することで、理解度を深めることができます。
コースをダウンロードして学習しましょう。
ラーニングコースをダウンロードしてオフラインで視聴しましょう。ダウンロードしたコースはLinkedInラーニングのモバイルアプリ (iOSまたはAndroid) で視聴できます。