ピックアップ記事

はじめてのhtml5 CSS3 

はじめてのhtml5 css3

はじめてのhtml5 css3

はじめての 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次回から複雑になった?要素の分類をしていきます。

お楽しみに!!

 

 

 

 

 

 

この記事を書いた人

中村 真徳
中村 真徳
(株)アリスプラン 代表取締社長
サービスITソリューションで関わる人を幸せに
平成5年4月1日 髙松市より香川町剛柔流空手道スポーツ少年団 発足
平成22年11月 個人事業主開業
平成24年8月  株式会社アリスプラン 代表取締役
会社理念「サービスITソリューションで関わる人を幸せに」
道徳と利潤の調和を目指し日々奮闘中
趣味…自分がしたいことをするのが趣味です

この投稿者の最近の記事

関連記事

  1. 受付さんです 笑

  2. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院

    天候と古傷

  3. CCC勉強会

    CCC勉強会

  4. 盆栽

    はじめてのhtml5 css3 変形とアニメーション

  5. 高松 骨盤 ゆがみ,チェック 骨盤 ゆがみ,骨盤 ゆがみ ストレッチ,骨盤 ゆがみ 矯正,骨盤ゆがみ解消,骨盤ゆがみ原因 骨盤のゆがみ,骨盤 ゆがみ 症状 骨盤,ゆがみ 直す,骨盤のゆがみチェック 骨盤 ゆがみ,腰痛 骨盤 ゆがみ,治す 骨盤 ゆがみ 矯正 ストレッチ 骨盤 ゆがみ ダイエット 骨盤ゆがみ 治し方 骨盤のゆがみを治す 骨盤のゆがみ 矯正 骨盤のゆがみを治す方法 骨盤 ゆがみ 改善 骨盤 ゆがみ 痛み 骨盤のゆがみを直す 骨盤のゆがみ 原因 骨盤のゆがみ 体操 骨盤 ゆがみ 肩こり 骨盤 ゆがみ 妊娠 骨盤 ゆがみ 矯正 体操 腰痛 骨盤 ゆがみ 産後の骨盤矯正 産後 骨盤矯正 骨盤矯正 産後 産後 骨盤矯正 体操 産後 骨盤矯正 方法 産後の骨盤矯正はいつから 産後ダイエット 骨盤矯正 産後 骨盤矯正 エクササイズ 産後 骨盤矯正 ダイエット 産後 骨盤矯正 保険 産後 矯正 骨盤 産後 矯正 産後 骨盤矯正 ブログ 産後骨盤矯正料金 産後 骨盤矯正 必要 骨盤矯正 産後 方法 骨盤矯正 効果 産後骨盤矯正効果 骨盤矯正ダイエット効果 骨盤矯正の効果 産後の骨盤矯正 効果 骨盤調整 効果 骨盤矯正 産後 効果 骨盤矯正 カイロプラクティック 効果 ダイエット 骨盤矯正 効果 骨盤 効果 骨盤エクササイズ 効果 骨盤矯正 効果的 骨盤 歪み 治す 骨盤の歪み 骨盤 歪み 骨盤の歪みを治す 骨盤 歪み ストレッチ 骨盤の歪みを治す方法 骨盤歪み治す方法 産後 骨盤 歪み 骨盤の歪み 治す 骨盤 歪み 体操 骨盤歪み 病院 骨盤の歪みを直す 骨盤歪み改善 骨盤歪み 影響 骨盤の歪み 治す方法 骨盤 歪み 身長 骨盤の歪み 影響

    骨盤がゆがむと太りやすい理由

  6. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院

    嚥下機能向上の必要性

  7. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院

    急な手首の痛み

  8. 第二回 CCC勉強会 

  9. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院

    緊急告知!

人気記事

  1. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院
  2. 予防体操 チラシ
  3. 高松市 猫背
  4. 整骨院, 求人, 治療, 高松 事故通院, 高松 整骨院, 高松市 ムチウチ, 高松市 整骨院

PV解析

  • 133現在の記事:
  • 92693総閲覧数:
  • 45今日の閲覧数:
  • 70昨日の閲覧数:
  • 498先週の閲覧数:
  • 2450月別閲覧数:
  • 62583総訪問者数:
  • 44今日の訪問者数:
  • 65昨日の訪問者数:
  • 448先週の訪問者数:
  • 1342月別訪問者数:
  • 58一日あたりの訪問者数:
  • 0現在オンライン中の人数:
  • 2013年9月21日カウント開始日:
PAGE TOP