忍者ブログ

おやっさんのWEBサイト制作への道

WEBサイト制作ど素人のおやっさんが、HTML、CSS、PHPなど学んでいく技術ブログです。

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

HTML/XHTML&CCS002(h1,p,)

※<>は全部全角で書いてあります。本当は半角です。

今日の朝はコンビニで、かなり年配の女性の方が働いてるのを見て自分も頑張らなきゃなと思いました。これからは、今日やった授業を全部ブログに書いてると時間が足りないので自分のわからないとことだけ書くことにします。
したがって見ている人にはわけがわらなく、まぁGUIのGは忍者ブログを運営している人に今は任せるとして、UIはできてないブログになります。(※元からできてない気もしますが・・・)

WEBサイトのトップページは・・・index.htmlにしたほうが良い。
なぜかと言うと基本、http://www.co.jpのあとにサーバー側でトップページを
http://www.co.jp/index.htmlと指定しているからです。

見出しタグはh1タグ~h6タグ

まであり、重要度において使い分けるそうです。
h1タグは基本1ページにつき1回までしか使えません。
上位の見出しより先に下位の見出を使わない。例えばh3→h1はダメです。要は番号順に使えってことです。

pタグ

・・・段落(1つの文章の集まりとがそんな感じです)タグです。
pタグで改行や空行が入るのはPタグをブラウザが独自に解釈した結果です。
先生曰くHTMLはページの見た目を作るものではなく、文書構造を作るものだそうです。
見た目を作るのはCSSだそうです。家にたとえるなら土台、骨組みがHTMLで外装、内装
がCSSって感じです。

W3C(World Wide Web Consortium)・・・HTML,XHTML,XMLの正解標準を計画している団体。

HTMLやXHTMLの勧告を公開しています。(※強制ではない)
強制ではないのでブラウザによって独自解釈され。表示がずれるそうです。
その為にブラウザ互換をもたせるテクニック、つまり表示ずれをなくすテクニック(ハック)があるそうです。

W3C validate(バリデート)・・・W3Cの勧告に合格してるかどうかチェックするそうです。
このサイトです↓
W3C validation

<img(タグ)src(属性)="aaa.png"(属性値) />

XHTMLのルール
①タグは小文字で書く。

②終了タグは省略できない。</p>とかスラッシュの入るのは省略できない。

③タグは入れ子にする。
例えば
<body>
<p></p>
</body>
は◎
<body>
<p>
</body>
</p>
は×

④空要素の末尾には半角スペース+/を付ける。
例だと<br />とかです。

⑤属性値は”でくくる。
<a href="http://validator.w3.org/">とかこんな感じです。

⑥これはよくわかりませんが属性値の省略各はしない
「~ checked="checked"」は属性値を書いてますね。
「~checked」はだけだと属性値は書いていないのでダメだそうです。

⑦これもよくわかりませんがname属性はid属性と併用する。
「<~ name="abc" id="abc">要はname属性をid属性と同じにすればいいみたいです。

連続する半角スペース一つの半角スペース扱いになる。
<p>こんにちは(※ここに半スペを3つ入れたことにする。)ドンタコスさん</p>
とこんにちはの後に半角スペースを3ついれても表示は・・・

こんにちは ドンタコスさん
となる。

addressタグ・・・連絡先、お問い合わせ先(メールアドレス・電話・住所)

CSS書き方
先生おすすめの書き方

h1 { font-size: 1.25em }
この例えだとh1の次に半角スペース
{の次に半角スペース
:の次に半角スペース
mの次に半角スペース
です。なぜかと言うとダブルクリックして選択するときに半角スペースは区切りなので、
そこで区切られて選択できるからです。コピペのとき便利です。
コピペしてやったほうが正確性、効率を上げられます。

上の例えだとh1部分がセレクタになります。セレクタはスタイル設定の適応先
(タグの名前、class、id、複数のタグです。)

font-sizeはプロパティと呼ばれていてスタイルの種類を指定します。

1.25emは値です

{}の間は設定内容です。

CSSの単位
px・・・
em・・・1em=1文字
%・・・最近使われるようになってきたそうです。親要素に対する文字の割合。
例えばうまい言い方が見つかりませんが・・・入れ子になっている外側のタグが親要素です。内側タグが子要素です。たぶんそんな感じです。

↓先生が勧めるWEBサイト紹介サイト
FWA
ABM
↓先生が勧めるHTML教本サイト
HTMLクイックリファレンス




PR

コメント

お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード Vodafone絵文字 i-mode絵文字 Ezweb絵文字

カレンダー

04 2024/05 06
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31

フリーエリア

にほんブログ村 IT技術ブログ HTML/CSSへ にほんブログ村 IT技術ブログ PHPへ

最新コメント

[11/23 テスト]

プロフィール

HN:
おやっさん
性別:
非公開

バーコード

ブログ内検索

P R

忍者ツールズプロフィール

忍者ツールズプロフィールは終了しました

カウンター