今更聞けないＨＴＴＭＬとＣＳＳのこと

こんにちは

ジョーカーです

今更聞けないHTMLとCSSについて

分かっている人いとっては当たり前のことなのですが、プログラムを勉強している私としては、みんなで共有したいです。わかる人ばかりではないと思いますので、分からない人の為にわかるように説明できたらいいかなと思って書いています。

これから書くシリーズはＷＥＢサイトの裏側っていうやつですよ。

どのように作られているのかなどです。

ブログを一から作るって人はいないと思いますけど、どういう意味なのかなど知っていれば、ここ気に入らないから書き直すみたいなことが出来るのではと・・・

これから、ＨＰを作る人にとてもいいかな。

では、ＨＴＭＬとＣＳＳについてです。

まず、ブログやHPのWEBサイトがどのように作られているか見たことがありますか？

「見たことがない」

「PGじゃないから見ない」

ほとんどないですよね（＾ω＾）！！！！

試しに見てみましょうか？

読者「見ることできるの？」

私「簡単ですよ」

ちなみにソースコードって聞いたことは？

「ちょっとだけ、でも何かはしらない」

「では、画面上で、右クリックしてみてください。そうしたらページのソースを表示という所をクリック」「何が出ましたか？」

「英語がたくさん出てきた」

これらの英語の文字たちで記述したプログラムのことをソースコードというやつです。

このページで見られると私のブログのすべてが見られて恥ずかしいのですが。

あまり見ないで・・・・・・

この中にはHTMLはもちろんCSSも書かれいてます。

HTMLとはどんなもの？

HTML（HyperText Markup Language）の略です。ウェブページを作成するために開発された言語です。 現在、WEBのほとんど、HTMLで作成されています。

これはHPやブログなどWEBページに使われている言語になります。

中身としては文字構造を指定するタグが存在します。

タグって何よ！！！

タグとは一言でいえば、命令のこと。

例：＜ｈ１＞これも＜br＞これのことをタグと言います。

他にはjavaScriptというのがあります

これらを使ってサイトを作っていきます。

では、CSSとは

CSS（Cascading Style Sheets）の略です。

HTMLでは見出しや段落、リンクなどを設定します。ですが、CSSでは見た目を変えます。文字の大きさや色、余白を設定します。

私のブログで、ソースコードを見て頂ければわかりますが、CSSという項目があり、そこに書かれているのが、CSSのスタイルシート言語になっています

分かりずらいかも・・・・

/*———————————————-

英語が4行ぐらい

———————————————– */

これの下にあるものです。

「ｃｓｓなんですね。違いが分からない」

「それぞれ書き方さえも違いますよ」

ＨＴＭＬとＣＳＳの書き方

タグを使って命令をします

よく使うのが、

とか・・・・、

・・・

ブログだとこれらかな

これで例えるなら、<タグ>・・・＜/タグ＞

タグとはdivやspanのことを言いますね。

・・・の後ろの「/」がついていると思いますがこれがこのタグの終わりを意味します。

<タグ>から＜/タグ＞ここまでということですね。

<タグ>・・・＜/タグ＞これの形のことを要素と言います

これでいうと・・・・が要素内容の部分

これらに属性を付けることが出来ます。属性とは効果のことを指します。

付かする場所して属性を開始タグに追加することで効果が付加される。

例

<h1 id=”goodstitle”>私はプロブロガーになってやる。</h1>

こんな感じになります

それぞれを説明すると

id・・・・・・・・・属性名

”goodstitle”・・・・属性値

id=”goodstitle”・・・属性

「ＨＴＭＬの書き方はこんな感じですよ」

「開始タグに属性を付けると何が変わるか実感できない」

「それは今度かな？」

「今教えてよ」

「だめ！！！」

HTMLでよく使われる要素があります

それらをまとめときました。