更新:2019-12-09初めてのCSSCSS/HTML/html5記事の紹介この記事では”style要素内にCSSを記述”を扱います。-初めてのCSS基本的な書式まず、簡単なサンプルから見て行きましょう。red;}</style></head><body><h1>1.自己紹介<p>エンジニア</p></h1><h1>2.趣味<p>ゲーム</p></h1></body></html>完成ソースここでは、cssファイルではなくstyle要素の中に見た目に関する記述をしていきます。書き方は以下の通りです。{プロペティ名:値;}「セレクタ」とは「どのようにスタイルを適用するか」を決めるルールであり、「プロパティ名」と「値」に対してはこちらの記事で説明した属性のようなものです。h1やpのようにタグ名を書いた場合、そのタグにスタイルが適用されます。実際に適用するプロパティとその値は「プロパティ名:値;」という型で記述します。プロパティ名と値の間は「:」(コロン)区切ります。簡単な例でもっとわかりやすく説明します。上記のソースのstyle要素の中に以下のような部分を注目してください。bold;}ここの場合「h1」は「セレクタ」、「font-style」は「プロパティ名」、「bold」は「値」となります。訳すると「ページ内のh1タグのfont-styleを全部boldに設定する」という意味です。「プロパティ」の場合は以下のように「複数を指定することも可能」です。{プロペティ名1:値;プロペティ名2:値;}上記のように、値の後ろに「;」(セミコロン)を書いて区切ります。上のソースでは以下のような形で使ってました。red;}こうすると、style要素の中を修正するだけで文書全体の見た目を一括に更新することができます。ボタンの背景色を全部白にしたい場合。}のように指定するだけでボタン全体の変更できます。文書中のすべての要素に適用する場合に使用されます。文書中の特定の要素にidを使用してスタイルを適用する場合使います。文書中の特定の要素にclassを使用してスタイルを適用する場合使います。id属性とは異なり、class属性は同じ値を重複して指定することができます。color:blue;}実戦これらのセレクタを色々使って以下のように使用することができます。{/*class="name"というクラス属性が指定されている要素の文字の色を青にします。{/*id="hobby"というクラス属性が指定されている要素の文字の色を黄色にします。{/*class="game_name"というクラス属性が指定されている要素の文字のサイズを30pxにします。{/*class="social_game"というクラス属性が指定されている要素の文字の色を緑にします。{/*h2の文字を太く表示します。"name">柴犬</span>です。id="hobby">ゲーム</span>です。class="social_game">プリコネ</li></ul><h2>皆さんよろしくお願いします。読み込み中...관련コメントを投稿するにはログインが必要です。site!%d人のブロガーが「いいね」をつけました。