第3回講座

それでは講座を始めます。
今日はWebページを作成するうえで必要なhtmlを作成してみましょう。
メモ帳を開いて↓のように書いてみて、ファイルの拡張子を「.html」として保存してみてください。

<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
これはHTMLです。
</body>
</html>

ブラウザでアクセスするとどうでしょう?
画面に「これはHTMLです。」と表示されますよね?

ん? むずかしいのう

ん?どれどれ、ちょっと見てみましょう。拝見しますね。

<htmlheadarset="utf-456万"
<titl/titleeabodyこれMLでむすう/bod/hml>

ああ、これはちょっと書き方間違ってますねえ。
コピー&ペーストで大丈夫ですよ。

こぴーあんどぺーすと?

説明がアレ(めんどくさい)ので下にコピーボタンを用意しました。
ボタンを押すとコピーされる(はず)なので、それをメモ帳に貼り付けてください。

できたのう

<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
これはHTMLです。
</body>
</html>

うほうhy7y7t7887っtpgh−−−−

アスカ文明キャラクター 博士WEBプログラマを目指す方へのワンポイントアドバイス!!
これはJavascriptでexecCommandというでクリップボードへのコピーをしています。
(がexecCommandは廃止されたようで今はClipboard APIというものを推奨しているようです)
<textarea id="samplehtml">&lt;html&gt;
&lt;head&gt;
&lt;meta charset="utf-8"&gt;
&lt;title&gt;&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
これはHTMLです。
&lt;/body&gt;
&lt;/html&gt;
</textarea>
<button onclick="copyText()">コピー</button>
<script>
function copyText() {
  let textarea = document.getElementById("samplehtml");
  textarea.select();
  document.execCommand("copy");
  alert("コピーしました");
}
</script>

わかったような気がするぜ! できたはできたのじゃが意味わからんのう
ホウホウ 今日の夕飯は何にしようかしら

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です