HTML初級基礎編｜iPhoneだけでHP作成

HTMLの骨格

図解で説明

図解にしてもあまり変化はありませんが、HTMLの基本はこうなっています。

HTMLは、<head>〜</head>と<body>〜</body>で構成されています。

最初の<!DOCTYPE html>はHTML５の宣言で（これはHTML５のファイルですよ）とコンピュータに教えてあげています。そして<html>〜</html>でHTMLファイル全体を表します。
headの部分はファイルの色々な情報が入り、bodyの部分が実際にブラウザに表示される部分です。なんとなくで構わないので覚えておきましょう。

前回の続き

前回にコピペしたファイルを確認したでしょうか？多分、文字化けが発生していたのではないでしょうか？

	➡︎

これはエラーではありません。わざとそうしてみました。まれにネットでも文字化けしているサイトを見かけると思いが、同じ状況にしてあるのです。

ではちゃんと表示させましょうね。

タグを追加 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>テストファイル</title>
</head>
<body>
<h1>テストファイル(h1)</h1>
<p>段落（文章)</p>
</body>
</html>

基本的な骨格

ベースファイル(base.html)

<html>だった部分に<html lang="ja">に変わっていますが、これは(日本語ですよ)って書き足しています。

これをコピペしてFTP精霊のローカルファイル(アプリのファイル)に記録しておけば、いつでもどこでもFTP精霊でHTMLの練習ができるようになります。あとは基本的なタグを覚えていけば良いわけですね。

	➡︎

HTML基本タグ

始めに覚えよう

基本的なタグをコピーできるようにしておきます。(<body>〜</body>間に入力します。)

見出し見出しはh_で表現します。１がいちばん大きくて６がいちばん小さな見出しです。ファイルで繋げて入力しても改行されて標準されます。
段落ひとまとまりの文章を<p>〜</p>で囲って表現します。このタグも改行されて表示します。
横幅いっぱいに境界線を引きます。
文字を太くします。
文字が斜体(イタリック体)になります。
文字を少し強調します。
改行します。
強く強調します。
標準よりも縮小して表示します。

ここで覚えておきましょう HTMLのタグには<h1>見出し</h1>のように開始タグ【<...>】と終了タグ【</...>】がワンセットになっているタグと、<br>のように単独のタグがあります。また、タグには定義された決まった役割があります。練習を重ねてスキルアップしましょう。

次は色を変える方法の説明です。

HTML初級基礎編