ホームページ作成には、HTMLと同じくCSSファイルの作成も必要となってきます。
HTML
ウェブサイトはHTMLというファイルを基にして作成していきます。＜＞で囲まれたタグという文字列を組んで作成していきますが、タグには様々な種類があります。HTMLはテキストエディタによって作成していきますが、＜＞で囲まれた最初に記述される部分を開始タグ、それに／が入ったものを終了タグと言います。
この開始タグと終了タグの間に挟まれている部分はコンテンツであり、セットで使われます。
新規にＣＳＳファイルを作成する場合
TeraPadやVisual Studio Codeといったテキストエディタでファイルメニューにて新規作成をします。その後に表示メニューで編集モードのＣＳＳを選択してから文字コードをＵＴＦ－8Ｎとして保存します。これでＣＳＳファイルを作成していきます。
CSSとは
CSSというのはHTMLで作成されたウェブサイトの見た目をよくする言語です。HTMLをレイアウトするためのスタイルシートを用意します。HTMLで作成したウェブページにCSSを適用させるにはどうすればいいでしょうか？
CSSを記述できる場所には以下のとおり三か所あります。
（１）CSSファイルを読み込んで適用させる。
．CSSの拡張子がついたCSSファイルをHTMLファイルとは別で作成し、それをHTMLファイルに読み込ませて適用させます。
一つのCSSファイルを作成し、それを他のHTMLファイルを複数作成したものに一括で適用させることもできます。
一般的な方法であり、HTMLファイルの<head>内に<link>タグを使ってCSSファイルを指定します。
ちなみに、<head>内にはページタイトルや説明文、リンクなどを記述します。
（２）HTMLタグの中にSTYLE属性を指定する方法
HTMLのタグ内に直接CSSを書き込んでいきます。書き込みしたHTMLのタグにのみCSSが適用されます。タグの中にCSSを記述するときは、STYLE属性を使用します。
（３）HTMLファイルの<head>内に＜style>タグで指定。
HTMLファイルの<head>内にCSSを書き込む方法です。CSSのルール自体は、<Style>～<／Style>の中に記述します。CSSを記述したHTMLファイルでのみ適用されます。
なお、<head>部分ではページのタイトルや説明文、外部ファイルのリンクなどが記述されます。
では、htmlファイル内に上記（１）の方法でCSSファイルの読み込みを行うとします。<link>タグを使用してＣＳＳファイルを参照するようにします。
index.ｈtmlファイルに<link href=”css/style.css” rel=”stylesheet”> と記述します。ｈrefでcss/style.cssを読み込むことから、フォルダ内にＣＳＳフォルダを作成し、さらにその中にstyle.cssというＣＳＳファイルを入れることで適用されるようになります。
コメント