HTML(初級編)
HTMLをコーディングしていくうえで必要なことの備忘録です。
通常忘れることはないと思うのですが、
最近忘れっぽいような気がするので、備忘録としてまとめておきます。
HTMLは、ドットインストールなどのプログラミング学習のサイトで、
学習させていただきました。
ドットインストールは、すごく丁寧なサイトで、動画でとても分かりやすいです。
備忘録として
- ATOMのコード保存 →ctl+S
- ATOMのコード移動 →選択し、ctl+上下
- ATOMのコードコピー貼り付け →行を選択し、ctl+shift+D
- ATOMのコードコメントショートカット →行を選択し、ctl+/
- ブラウザ更新→ctl+R
- マークアップ<h1>・・・</h1>、<p>・・・</p>
- 同じフォルダの中にあるimgフォルダの内の画像を表示
<img src=”img/jiro.png” width=”140″ height=”140″ alt=”次郎アイコン”>
- <!DOCTYPE html> 一番はじめに
<html lang=”ja”>・・・</html> 日本語でということ - <head>
<meta charset=”utf-8″> 文字コードはこれで決まり!
<title>次郎のポートフォリオ</title>
<link rel=”icon” href=”favicon.ico”>
<meta name=”description” content=”次郎の紹介です”>
</head> - <!– コメント –>
- bodyの中を<header> </header> <section></section><footer></footer>に大きく分ける
- 箇条書き<ul> <li> </li> </ul>
- 連番<ol> <li> </li> </ol>
- リンク設定 <a href=”http://kamisiru.com”> 〇〇〇 </a>
- リンク先を別タブで開きたい場合 <a href=”http://kamisiru.com” target=”_blank”> 〇〇〇 </a>
- メールを開きたい場合<a href=”mailto:kamisirukamisiru@gmail.com” target=”_blank”>
- <head>の中に
- <style>
h1{
color:red;
}
</style> でデザインを変更できるが、CSSファイルを使用する
- <style>
- htmlの中にjavascriptを入れる場合、<div><script> 〇〇〇</script></div>とする。divで囲む。注意点として、〇〇〇の中は、空の行は無くさなければならない。