ブログのテンプレートを自分で作ってみたかったので
htmlをやってみることにした(´・ω・`)
そもそもHTMLってなんぞ？
HyperText Markup Languageの略
直訳すると超テキスト目印言語となる
なんだか超意味不明だが
言語＝プログラミング言語を指しているのかはよくわからないけども
とりあえず普通のテキストではなく言語だということがわかる
ブラウザで画像とか文章とかリンクをして表示させる
ための言語ってことでOKかな(´・ω・`)？
作成に必要なものは？
・テキストエディタ
htmlを記述するため
ubuntu環境なのでデフォルトで入っているgeditを使用することにした
・ブラウザ
作成したhtmlを表示させるため
同じくubuntu環境なのでデフォルトで入っているfirefoxを使用
・webサーバ
ルーターのパスワードを忘れてしまい自宅環境でローカルしか
公開できないのでどこか間借りしてアップロードしてみる
タグの要素①
<html> ～ </html> : 開始タグと終了タグの間にhtmlを記述する
<head> ～ </head> : 開始タグと終了タグの間にページ情報を記述する
<title> ～ </title> : 開始タグと終了タグの間にページタイトルを記述する
<body> ～ </body> : 開始タグと終了タグの間に本文を入力する
これを使ってそれっぽく書いてみると
***********************************************************
<html>
<head>
<title>ここがタイトルかね(´・ω・`)</title>
</head>
<body>
輝くボディ(´ﾟωﾟ｀)
</body>
</html>
***********************************************************
こんな感じで入れ子構造みたいに記述する
ちなみにくまろぐのソースを表示してみるとわかりやすい
ブラウザのメニューバーから［表示］>［ソースの表示］
だいたいこの形が基本なのかな？
じゃあ記述してみたものをブラウザで見てみようか(´・ω・`)
わかりやすくデスクトップ上にhtmlという名前のフォルダを作成
そのフォルダの中に先ほどそれっぽく書いたhtmlを「index.html」
という名前で保存する（拡張子がhtmlになってることが注意ね）
じゃあさっそく保存したhtmlファイルを開いてみる
拡張子がhtmlファイルなので自動でブラウザが立ち上がり表示されます
さっき記述した
<title> ～ </title>部分はブラウザのページタイトル部分へ
<body> ～ </body>部分はブラウザの本文部分で
表示されていることがわかる
今日は時間が無いのでとりあえずここまで(；´ω｀)
0 件のコメント:
コメントを投稿