日別アーカイブ: 2021年8月2日

CSS学習のまとめ1(概要とWebfont)

CSSとは?

Cascading style Sheetsの略

文字の色やサイズ、レイアウトなどを指定できる

HTMLで書かれた構造化された文章のスタイルを指定するための言語

HTMLは文章構造、CSSは見た目と分けるのが常識になっている。

CSSの書式

セレクター(どこの) {

プロパティ(なにを): 値 (どうする);

}

CSSの組み込み方による優先順位

・インライン>内部参照、外部参照

不具合の温床になるので基本的には
外部参照(外部ファイルにCSSを記載する)を使おう

色の指定
いろいろな指定方法がある16進数表記が多いそう

HTMLの記述

<!DOCTYPE html>
<html lang="en">
 <head>
   <meta charset="UTF-8" />
   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Document</title>
   <link rel="stylesheet" type="text/css" href="style.css" />
 </head>
<body>
  <h1>CSSで色が変わります。</h1>
</body>
</html>

<link rel="stylesheet" type="text/css" href="style.css" />

↑CSSを読み込む設定

↓フォルダ内の配置図

CSSの記述

h1{
 color: #FF0000;
 color: #F00;
 color: rgb(255,0,0);
 color: rgb(100%,0%,0%) ;
 color: red;
}

このように表示されます

続きを読む