ホームページの作り方 〜応用編(準備)〜
2019年10月15日
みなさま、こんにちはー(*´ω`*)ノ
花です(*´ω`*)
ラグビーワールドカップ、日本対スコットランドの試合はみなさん見ましたか!?
私は、やっとここにきて見れました(*´ω`*)
もうルールわかんないのに弟と2人で大興奮で見てました(笑)
スコットランドの追い上げは怖かったです!
必死さがめちゃくちゃ伝わってきました><
でも、日本もめちゃくちゃ強くて見事勝利!
そして、日本は初めてベスト8ということで、もう本当にお祭り騒ぎですね(*´ω`*)
決勝トーナメントの初戦は、南アフリカだそうです。
あの4年前、戦った相手です。
どうにか今度も日本に勝ってほしい><
でも、激しいスポーツだからこそなるべく怪我がないことを祈ります><
ということで、私も大興奮の試合でした!
日本代表おめでとう!!
さて、今回からは、ホームページの作り方 〜応用編(準備)〜と応用編に入っていきます!
みなさん、しっかりついてきてくださいね!
さて、質問です。
ホームページを作ることもプログラミングの一種になるのですが、このプログラミングの練習は普通の国語や数学などの勉強と違うことがあります。
それは何でしょう?
次の中から選んでくださいね(*´ω`*)
@テストがないから暗記なんてしなくていいし、ネットで調べながらできる。
A勉強したらすぐに練習したほうが身になりやすい。
Bまず基礎を勉強したら、あとは知りたいところだけ勉強していくなんてことができる。
正解は、最後にしますね(*´ω`*)
では今回は、下記のような状態にしたいと思います。
見てもらったらわかるように色がついています。
ということで、応用編はHTMLの見た目を変えていくCSS(スタイルシート)というものを説明していきたいと思います。
ただ、その前に準備を一つしようと思います。
今回はそのお話です。
CSSといわれるものは、3つ書く方法があります。
@HTMLのタグに直接書き込む
AHTMLのhead内にまとめて書く
BCSSの別ファイルを用意してそちらにまとめて書く
と3つあるのですが、今回は初心者向けということでAから説明していこうと思います。
おいおい、@とBの説明をしますね(*´ω`*)
では、さっそく書き方ですが、headのタグの中に下記のものを書きます。
<style type="text/css">
</style>
これで準備万端です!
画像にするとこんな感じになっています。
ではさっそくですが、1つだけ試しに書いてみましょう!
といいたいところですが、それはまた次回(*´ω`*)
では今回はこの辺でー(*´ω`*)ノ
ちなみに質問の正解は、全部です(*´ω`*)
~~~ヾ(*'▽'*)o マタネー♪
花です(*´ω`*)
ラグビーワールドカップ、日本対スコットランドの試合はみなさん見ましたか!?
私は、やっとここにきて見れました(*´ω`*)
もうルールわかんないのに弟と2人で大興奮で見てました(笑)
スコットランドの追い上げは怖かったです!
必死さがめちゃくちゃ伝わってきました><
でも、日本もめちゃくちゃ強くて見事勝利!
そして、日本は初めてベスト8ということで、もう本当にお祭り騒ぎですね(*´ω`*)
決勝トーナメントの初戦は、南アフリカだそうです。
あの4年前、戦った相手です。
どうにか今度も日本に勝ってほしい><
でも、激しいスポーツだからこそなるべく怪我がないことを祈ります><
ということで、私も大興奮の試合でした!
日本代表おめでとう!!
さて、今回からは、ホームページの作り方 〜応用編(準備)〜と応用編に入っていきます!
みなさん、しっかりついてきてくださいね!
さて、質問です。
ホームページを作ることもプログラミングの一種になるのですが、このプログラミングの練習は普通の国語や数学などの勉強と違うことがあります。
それは何でしょう?
次の中から選んでくださいね(*´ω`*)
@テストがないから暗記なんてしなくていいし、ネットで調べながらできる。
A勉強したらすぐに練習したほうが身になりやすい。
Bまず基礎を勉強したら、あとは知りたいところだけ勉強していくなんてことができる。
正解は、最後にしますね(*´ω`*)
では今回は、下記のような状態にしたいと思います。
見てもらったらわかるように色がついています。
ということで、応用編はHTMLの見た目を変えていくCSS(スタイルシート)というものを説明していきたいと思います。
ただ、その前に準備を一つしようと思います。
今回はそのお話です。
CSSといわれるものは、3つ書く方法があります。
@HTMLのタグに直接書き込む
AHTMLのhead内にまとめて書く
BCSSの別ファイルを用意してそちらにまとめて書く
と3つあるのですが、今回は初心者向けということでAから説明していこうと思います。
おいおい、@とBの説明をしますね(*´ω`*)
では、さっそく書き方ですが、headのタグの中に下記のものを書きます。
<style type="text/css">
</style>
これで準備万端です!
画像にするとこんな感じになっています。
ではさっそくですが、1つだけ試しに書いてみましょう!
といいたいところですが、それはまた次回(*´ω`*)
では今回はこの辺でー(*´ω`*)ノ
ちなみに質問の正解は、全部です(*´ω`*)
~~~ヾ(*'▽'*)o マタネー♪
タグ:タグ
この記事へのコメント
コメントを書く