フォースと共にあらんことを


今回はcssの書き方について

CSSってなに?と思ってる人は前回の記事を読んでくれるとわかりやすいかも

簡単におさらいをしておくと

ホームページ = HTML(構造) + CSS(見た目)

ということ。

ホームページの基本はすべてHTMLとCSSで出来ている。

他にもスライドなんかの動きを付けるためのjavascriptやPHPっていうプログラムもあるけど、これらはあくまでおまけでサイトはHTMLとCSSがないと成り立たない。

それでは本題

CSSの書き方について

css

上の書き方だと、h1というタグの文字の大きさを20ピクセルにするというもの

セレクタはHTMLのどのタグに適用するか、

プロパティはどんなスタイルを適用するか

値は実際にどんなスタイルにしたいかを指定する

cssを書くときに一番ミスりやすいポイントとして『プロパティと値の間に「:(コロン)」を忘れる』『値の後ろに「;(セミコロン)」を忘れる』

この2つはまじでよく忘れるので、自分でCSSを編集しても見た目が変わらない場合はまず見てほしい。

複数のスタイルを適用する

スタイルは複数適用することもできる。

例えば、pタグで囲われている文字を大きくして色を赤くしたいときは以下のように書けば

p {
font-size: 20px;
color: #f00;
}

こんな風に文字を大きくすることが出来る

頑張ればこんな風にフォースを感じそうな演出もできる…使いどころないと思うけど 笑

Episode IV
A NEW HOPE

It is a period of civil war. Rebel spaceships, striking from a hidden base, have won their first victory against the evil Galactic Empire.

During the Battle, Rebel spies managed to steal secret plans to the Empire’s ultimate weapon, the DEATH STAR, an armored space station with enough power to destroy an entire planet.

Pursued by the Empire’s sinister agents, Princess Leia races home abord her starship, custodian of the stolen plans that can save her people and restore freedom to the galaxy. . . .

  

SNSでもご購読できます。