総目次へ top

ウェブページ作成 もくじ

基本

1.準備(linux)

2.とりあえず作る

3.DOCTYPE宣言

4.使ったタグの解説

5.ページを公開する

6.タグの基本

7.文字で構成する

8.リンク

a.ウェブページ/ホームページ

b.html の変遷

c.html5 へ

d.DOCTYPE宣言・XML宣言のこれから

e.よくある間違い

スタイル

1.せめて色をつけよう

2.カラーコードで色指定

3.ブロックと余白

4.段落の整形

5.ブロックのpaddingとborder

6.同じタグに異なるスタイル

a.薄い色と灰色のカラーコード

b.色の見本表

c.色の混合をやってみる

Inline

1.一部の強調

2.spanタグ

3.spanを駆使する

4.リンクに加える

1.インラインタグ一覧

画像

1.画像のあるページ

1b.画像にも読み取り許可を与える

2.大きな画像を使う

3.小さな画像

4.透過画像

5.透明度と1色の透過

6.文章中の画像

7.背景に画像

8.背景画像のテクニック

a.この画像はどれ?。

b.小画像と文字の位置関係

c.png画像への変換

d.jpg(jpeg)画像への変換

e.GIMPによる透過画像作成

f.GIMPによる一色透過画像作成

g.背景画像の配置

h.背景画像の配置2

リスト・テーブル

1.リスト

2.テーブル

3.テーブルヘッダ

4.複数の表に別々の見栄え

5.幅の指定

6.高さの指定

7.配置

8.スタイルシートで整形

9.セルの結合

a.ulやolはmarginとpaddingをセットで

b.表の枠のいろいろ

c.表の枠のいろいろ(2)

メッセージ

1.読者からメッセージを

2.ラベルをつける

3.選択してもらう

4.ラジオボタンにラベルをつける

5.プルダウンメニューで選択

a.メールとmailto:

レイアウト

1.スタイルシートでレイアウト

2.レイアウトのための元データ

3.レイアウト解説

4.課題 sandan.html

5.スタイルシートの位置

6.スタイルシートの切替

7.スタイルシートの切替のための元データ

8.セレクタ

a.レイアウト例

b.widthとmargin。

著作権など

1.こんなのは困る?

2.みんなの考え

3.著作権

a.こんなときは?。

b.著作権法

動きのあるページ

1.別のウインドウに

2.自動的に移動

3.クリックで切替

4.マウスが来たら

5.アニメーション

6.アニメーション応用

7.ランダムに画像を出す

8.ランダムな場所の画像を変える

9.入力された値を使う

10.サムネイルからの画像の別ウィンドウ表示

11.Popupウィンドウ

1.getElementByIdの昔のやり方

3.動きのあるページ

4.if の代わりに switch

5.javascript記述上の注意

6.パーセントエンコーディング

DOM

1.DOMとノード

2.エレメントノードの取得(ByID)

3.エレメントノードの取得(ByTagName)。

4.属性ノードの変更

5.属性ノードの読み取り

6.class属性の変更でスタイルを変える

7.イベントハンドラの取付

8.イベントハンドラのthisキーワード

9.読み込み終了後実行

10.テキストを入れ替える

11.子ノードが複数ある場合

12.新しい要素を作る

13.応用 ページ内目次をつくる

14.応用 ページ内目次に戻るボタン

15.応用 選択表示

16.応用 選択表示キーワード自動収集

1.イベントハンドラの取付(37)

2.テキストノード変更サンプル(41)

3.タグ中のタグの親子関係に注意(41)

4.選択表示キーワード自動収集プログラム解説

5.メモ

5.DOMの互換性調査

5.for を使った繰り返し詳説

13.idを作りながらページ内目次をつくる

HTML5

1.Canvas

2.基本図形

3.色の指定

4.後から描く

5.繰り返しのあるもの

PHP

1.php

2.入力されたデータの加工

3.入力されたデータを自分自身に送る

4.掲示板

5.ファイルを読んで表をつくる

6.並べ替え

7.選択1

8.選択2

9.選択と並べ替え

10.あいうえお順に並べ替え

1.xhtmlでのxml宣言

6.ファイルを読んで表をつくるの別解


聖愛中学高等学校
http://www.seiai.ed.jp/