2019RSSプロフィールみきてぃみきてぃ20代のブロガーです。IT・インターネット関連や生活関連、趣味の1つである観賞魚などの記事を書いています。趣味プロフィール2024.07.25HTML・CSSCSSとは何か?使い方や組み込み方を解説【初心者でもわかる】みきてぃHTMLでサイトを作っていると、よく出てくる単語がCSS。「ウェブサイトを作りたいけど、CSSとは何なのかイマイチ分からない...」という初心者の方も多いと思います。そこで今回は、初心者でもわかりやすく「CSSとは何か」をご紹介します。Sheetes」の略称表記で、これはHTMLファイルに書かれている文書のデザインや、サイトのレイアウトを整えることができるテキストファイルです。別名「スタイルシート」とも呼びます。CSSの歴史CSSの歴史を簡単にまとめると、以下の通りとなります。年CSSにおける出来事1994年スイス・ジュネーブのCERNに勤めていたホーコン・ウィウム・リー氏が、CSSを提唱した。3』がCSSをサポートするようになった。当初はW3CからCSSの勧告が発表されていなかったため、ボックスモデルなど一部機能は導入されなかった。Level1(CSS1)が、W3Cから勧告された。Level2(CSS2)が、W3Cから勧告された。2011年6月CSS2.1がW3Cから勧告された。Level3)以降はモジュール単位で新機能が実装される形になっています。Level4が最新規格となっていますが、CSSがモジュール化したため、CSS4という定義は存在しません。案件評判CSS3・CSS4とは?CSSの歴史と現状、Level(レベル)の遷移について調べてみた。WEMOCSSの基本的な書式それでは、CSSの基本的な書式について解説していきましょう。セレクタスタイルを適用する対象です。「h1」を指定した場合、指定したタグにCSSが適用されます。波かっこセレクタの後、プロパティと値を囲む記号です。別名、「宣言ブロック」とも呼ばれています。波かっこ内に複数のプロパティを指定することができます。プロパティ適用するスタイルの種類となります。小文字で記述しないといけません。プロパティの最後にはコロンを忘れずに入れましょう。コロンプロパティと値を区切るための記号です。この記号によって、対象となる要素が「プロパティが指定した値」となります。値スタイルの細かな内容を数やキーワードで指定します。colorプロパティに「red」という値を入れた場合、colorプロパティを指定しているセレクタに「文章の文字の色を赤色にする」が適用されます。セミコロン値を入力した後、最後にこの記号を入れます。セミコロンを忘れると、CSSが正常に動作しないこともありますので、忘れずに入れましょう。使い方CSSの使い方は主に3つあります。単独のプロパティで指定する複数のプロパティで指定するセレクタをグループ化してから指定する単独のプロパティで指定したやり方1つのセレクタの中に、単独のプロパティを指定します。red;}複数のプロパティで指定したやり方1つのセレクタの中に、複数のプロパティを入れて設定することができます。応用ですが、セレクタにカンマ(,)を使うことで同時に複数のセレクタを使ってプロパティを指定することができます。red;}CSSをHTMLに組み込む実際に、CSSをHTMLに組み込んでいきます。CSSをHTMLに組み込む方法は5パターンあります。link要素を使う最も基本的なやり方です。HTMLファイルとは別に用意したCSSファイル(いわゆる「外部スタイルシート」)をHTML文書のheadタグに囲まれている部分にlink要素を組み込みます。}上記のコードを実際にブラウザで表すとこうなります。Style要素を使うHTML文書内のheadタグに囲まれた所に、style要素を直接入れるやり方です。}</style></head>上記のコードを実際にブラウザで表すとこうなります。Style属性を使うHTMLのグローバル属性であるstyle属性を使ったやり方です。#0000ff;”>ブルーベリー</span>の収穫時期ですね。</p>@import規則を使うCSSの文書内およびHTML文書のstyle要素内に記述し、外部スタイルシートを読み込むやり方です。url(“style.css”)@charset規則を使うこのやり方は文字コードのみとなりますが、CSS文書内の先頭に@charset規則を入れることで、CSSの文書内に日本語が入っても文字化けを防ぐことが出来ます。“shift_jis”;/*ここにコメントが入ります*/まとめCSSとはHTMLファイルに書かれている文書のデザインや、サイトのレイアウトを整えることができるファイル。CSSの組み込み方法CSSは、link要素style要素style属性@import規則@charset規則の5つの方法で組み込むことができる。いうわけで、今回は「CSSとは何か」についてご紹介しました。CSSはHTMLと同様にWebサイトの制作に必要なファイルです。今回の記事が参考になれば幸いです。HTML5&CSS3/2.1全事典』(インプレス)この記事を書いた人みきてぃみきてぃ20代のブロガーです。IT・インターネット関連や生活関連、趣味の1つである観賞魚などの記事を書いています。≫詳しいプロフィールを見る≫お問い合わせはこちらスポンサーリンク当ブログ内の記事を探す検索プロフィールみきてぃ20代のブロガーです。IT・インターネット関連や生活関連、趣味の1つである観賞魚などの記事を書いています。複数のプロパティで指定したやり方セレクタをグループにしたやり方CSSをHTMLに組み込むlink要素を使うStyle要素を使うStyle属性を使う@import規則を使う@charset規則を使うまとめ関連記事こちらの記事もどうぞ!【HTML】定義語や略語、頭文字を示すタグの使い方2021.04.07HTML・CSSみきてぃミキティ・Tのブログ【HTML】作品のタイトルや文章の引用であることを示すタグ2021.04.05HTML・CSSみきてぃミキティ・TのブログHTML/CSSでコメントアウトを書く方法2021.03.03HTML・CSSみきてぃミキティ・Tのブログ【HTML】見出しタグの正しい使い方を解説2021.02.27HTML・CSSみきてぃミキティ・TのブログHTMLとは何か?構造の仕組みや使い方を解説【初心者でもわかる】2021.07.01HTML・CSSみきてぃミキティ・Tのブログ【HTML】文章にルビを振る方法を解説2021.02.26HTML・CSSみきてぃミキティ・TのブログこのサイトはreCAPTCHAによって保護されており、Googleのプライバシーポリシーと利用規約が適用されます。ミキティ・Tのブログ記事URLをコピーしました。