CSSとは?
HTMLで書いた文章を、デザインするための言語です。
CSSは、Cascading Style Sheetsの略です。
Cascading は、段階的に流れていくという意味です。
準備
HTMLでサンプルページを作成します。
![](https://tumaboki.com/wp-content/uploads/2020/10/614b0ca9e84a995e812dbe0e7a078722.png)
![](https://tumaboki.com/wp-content/uploads/2020/10/262183e45aa069cfbba12f9d2088d9d7.png)
文字に色を付ける
linkタグでcssファイルを指定します。
cssファイルで、色を付けたいタグ(今回はh1)を指定します。
colorを使うことで、文字に色をつけることができます。
コードの終わりに;(セミコロン)を忘れないようにしましょう。
指定する要素をセレクターと呼びます。(今回ならh1)
指定するスタイルを宣言と呼びます。(今回なら、color:red;)
宣言の左側を、プロパティと呼びます。(今回なら、color:)
宣言の右側を、値と呼びます。(今回なら、red;)
![](https://tumaboki.com/wp-content/uploads/2020/10/ba18527676f9e9cf561f354351e39d6b.png)
![](https://tumaboki.com/wp-content/uploads/2020/10/142f27e341d8dbbe01dd75a61a930420.png)
文字の大きさを変更する。
font-sizeプロパティを使うと、文字の大きさが変更できます。
![](https://tumaboki.com/wp-content/uploads/2020/10/2bd2ddc20fb0687e2c9e99618c7054e2.png)
![](https://tumaboki.com/wp-content/uploads/2020/10/58b0219e39ae64400336ecdcdc9208fd.png)
プロパティの継承
セレクターをbodyタグにすることで、h1タグとpタグの両方にスタイルを設定することができます。
これをプロパティの継承と呼びます。
プロパティは、継承されるものと継承されないものがあります。
colorプロパティは、継承されるプロパティです。
borderプロパティは、継承されないプロパティです。
borderプロパティを使うことで、境界線をつけることができます。
![](https://tumaboki.com/wp-content/uploads/2020/10/607b65d3cb960bf27204ed83637414ce.png)
![](https://tumaboki.com/wp-content/uploads/2020/10/2529218d93e008a3e763adaa85c0dac3.png)
コメント