はじめての html5 CSS3 連載していきます、
まず、htmlの全体構造です。
最初に書きましたが、htmlにはドキュメント宣言(英語で書くとDOCTYPE宣言)
html5の前までは、暫定でDTD※文章型定義と呼ばれる宣言のされかたをしてきました。
DTDをhtmlの先頭にあるドキュメント宣言をすることで、そのhtmlファイルがそのバージョンによって記述されているかが分かっていましたが、
<!DOCTYPE html>
と宣言するだけで新しい、標準基準のページというふうに自動的に切り替わるようになったのです。
ちなみに※小文字でもOKみたいです。
<!doctype html>
で、次は様々なメタ要素を(いわいる情報)の種類を書いていきます。
meta要素＝meta要素は空要素なので終了タグはありません。
<meta chrset=”utf-8″> 文字コード
<meta name=”genertor” content=”このWEBページを作成したソフトウェアをいれます”>
<meta neme=”description” content=”検索結果として表示される場合はここに書きます”>
他にも
<meta name=”keywords” content=”キーワードをいれます コンマくぎりでいれてね”>
<meta name=”robots” content=”ALL”>
※巡回型のロボットにデータベースに取り込むことを許可すること
<meta name=”author” content=”中に会社の名前をいれます”>
ここで分かってくるのが、実は meta neme=”属性” content=”内容”
こんな感じですかね？
間違っていたらコメントくだちいΣ(ﾟдﾟlll)
まあ色々ありますが、実は
「検索エンジン対策の際に必要なmetaタグは、description と keywords のみたいです」
まあ、知っているにはこしたことにはないですが、親切なコーダーになれればいいですねヽ(・∀・)ノ
そしてメタタグを書いたhead内には装飾のCSSのリンク等を書いていきます。
@charset “utf-8″
拡張因子が、.css のファイルをリンクしています。
同じ階層であればそのまま
<link rel=”stylesheet” herf=”ほにゃらら.css”>
でリンクできます。
リンクの階層が下がる場合はそこの
<link rel=”stylesheet” herf=”下がるフォルダ/ほにゃらら.css”>
スラッシュでリンクします、実はこんなしょーもないことも、中村は手を焼いていました。。笑
＼(◎o◎)／！
逆に1階層上がって、リンクする場合は
<link rel=”stylesheet” herf=”../ほにゃらら.css”>
という感じです。上がるたびに../../../../../となっていきます(´･Д･)」
簡単ですね☆
あとは、メディアですね。
これはレスポンシブデザインを作るのにも必要になってきます。
CSSに直接書くほうが、管理しやすいようです。
しかし、メディアごとに分けてみるのもありかもしれませんね（´∀｀）
ざっと使いどころなところを書いていきますね。
<link rel=”stylesheet” herf=”ほにゃらら.css” media=”適応対象”>
というところでしょうか？
mediaの使い方は、
all すべての機器 screen パソコン画面 print プリンタ projection プロジェクタ
tv テレビ handheld 携帯用機器（画面小さいもの）speech 音声読み上げソフト
braille 点字ディスプレイ embossed 点字プリンタ
<link rel=”stylesheet” herf=”.css” media=”all”>
何もかかないと、デフォルトではallになっているとは思います。
で、スタイルシートの中にまたスタイルシートを読み込むと、
@import “ほにゃらら.css”; ←セミコロンを忘れずに
@import “ほにゃらら.css” tv.projection; こんな感じで出力が変えれます☆
それでは、html5次回から複雑になった？要素の分類をしていきます。
お楽しみに！！
