LoginSignup
1

More than 5 years have passed since last update.

HTML5の書き方_1(基礎)

Last updated at Posted at 2018-02-05

絶対必要なもの

1.DOCTYPE宣言
 HTMLには複数種類がありどの仕様で書くかを宣言する
 ●記述方法

index.html
<!DOCTYPE html>

 ●理由
 記述しないと表示モードによってはレイアウトがおかしくなる

2.charset 属性
 どの文字コードを使用するか宣言する
 ●記述方法

index.html
  \<meta charset="UTF-8">

 ●理由
 記述しないとスクリプト等が上手く動かない可能性がある

3.reset.css
 各ブラウザのデフォルトCSSをリセットする
 ●記述方法(これをresst.cssで保存する)

resst.css
    /*
  YUI 3.18.1 (build f7e7bcb)
  Copyright 2014 Yahoo! Inc. All rights reserved.
  Licensed under the BSD License.
  http://yuilibrary.com/license/
  */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

 ●理由
 各ブラウザのデフォルトCSSが違うため(リセットして書いたほうが書きやすい)

あったほうがいいもの

1.lang 属性
 ブラウザの設定によっては上手くフォントが表示されないらしい
 ●記述方法(日本語を指定しています)

index.html
  <html lang="ja">

 ●理由
 なくても問題ないらしいけど書いておいたほうが無難

感想

初投稿
慣れてないとわかりずらいな

次へ

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1