Y.COM (vol.3)内容一部
全71ページ
(本体53
ページ+付録18ページ)


目次


 

【基礎講座のまとめ】

ホームページを見る仕組み
ホームページを見るためには、見たいページのデータをもらわなければならない。
けれど、普通に考えると何もせずに他のパソコンのデータをもらうことは出来ないので、回線を使ってパソコン同士をつなぐことにした(ネットワークの完成)。
しかし、日本中や世界中の人のホームページを見るためには、自分たちで回線をつなぐことができないので世界中に張りめぐらされている電話回線を使ってネットワークを作ることにした。
また、そのインターネットを利用して自分の情報をデータとして公開して、様々な人たちに見てもらえるようにしたものがホームページである。

ホームページを見るために、相手からデータをもらう場合、相手のパソコンも動いていなければならないが、一般お人はパソコンを24時間動かしておくということは大変なので、たくさんのパソコンからある1つの場所(プロバイダ、サーバー)に回線をつなぎ、そこにデータを保存なしておく。
プロバイダ(サーバー)は常に動いているので、そこにあるホームページはいつでも好きな人が見ることができる。
こうして、ホームページはいつでも好きな時に見ることができる。

 

【HTML講座のまとめ】
4.属性

タグについて
タグは基本的な機能しか備わっていない。
そこで、属性というもので複雑な指定を行う。

属性
タグというのは基本的な機能を指定する。
属性では、その他の指定などの細かい部分の指定を行う。

    <タグ 属性="■">

例)
<FONT colo="red">
<HR size="5">

5.コメントを入れよう

● コメント

<!-- ■ -->

■に書かれた文字列はブラウザ上では表示されない

■に書かれた文字列はブラウザ上では表示されない。

テキストに関するタグ

1.行を変えよう(改行)

● 改行

<BR>

改行する

文章を次の行に移すことを改行という。

2.行を変えよう(段落)

● 段落

<P>
<P> 〜 </P>

機能:段落
属性:ALIGN

<BR>では、次の行に移行するタグだったが、<P>では1行スペースを空けて表示する。

属性

段落の位置を指定

ALIGN

■:left(左寄せ), right(右寄せ) , center(中央揃え), justify(均等割付)


<P>は連続では使えない。複数行明けたいときは<BR>を並べて使う。


均等割付とは、文字の大きさをそろえること。

 

【CSS講座のまとめ】

CSSの使い方
・ HTML内への埋め込み
・ タグへの埋め込み
・ 外部ファイルの読み込み

HTML内への埋め込み
HTMLファイル内に書く方法

<STYLE TYPE="text/css">
ここにスタイルを書く
</STYLE>

基本的に、<HEAD>〜</HEAD>内に書く。

タグへの埋め込み

<タグ STYLE={指定}>

外部ファイルの読み込み
ファイルの作成
拡張子".css"にして保存。
ファイルの呼び出し

<LINK REL=STYLESHEET HREF="■" TYPE="text/css">
■・・・外部CSSファイル名(拡張子は".css")

外部ファイルから外部ファイルの取り込み

@import url(■);
@import "■";

■・・・・CSSファイルのURL

スタイルの優先順位
スタイルには優先順位がある

[強い]                             [弱い]
タグへの埋め込み > HTML内への埋め込み > 外部ファイル

第一優先にする

スタイルの指定中に
!import
を入れる。

スタイルの中に"!important"を入れることによって、その指定に関してはそれが一番強くなる。

 

【JavaScript講座のまとめ】

オブジェクト
ブラウザは細かく部品が分けられていて、その部品に対して命令を出す。

ブラウザに文字を書く

document.write("■");

■ ・・・・表示させたい文字列(HTMLも可)

オブジェクト
document    ページ表示部に
write       文字を書く

「 " 」について
「 " 」文字をそのまま表示させるためのもの
「 " 」ではさまれた部分は、ブラウザ上(厳密には}HTML上)にそのまま文字を書く。

「 ; 」について
「 ; 」とはプログラムの終わりを表したもの
プログラムの終わりには「 ; 」をつけると覚えておく。

■に入る文字列
■に入るものは厳密にはHTML文書として書くもの。
つまり、タグを使うとタグが変換されてしまう。

■の中に「 " 」を入れる
■の中に「 " 」を入れると、ブラウザは文章の終わりだと間違ってしまう。
このようなことを避けるために、「"」と「'」をうまく使ってエラーを避ける。
又は、メタ文字という「\」のような記号を使って,文字として認識させる。

window.document.write()
document.write()は正しくはwindow.document.write()と書く。
windowとはブラウザ全体を示していて、それは当然のことなので省略する事ができる。

 

【DHTML講座のまとめ】
1.イベント

イベントとは

イベントとは、ユーザーの様々な操作に対し、何かプログラムを行うようにするためのもの。

マウスに関するイベント

onmousedown = "■";   :マウスを押している間■を実行する
onmouseup = "■";     :マウスを放した時■を実行する
onclick = "■";       :マウスをクリックすると■を実行する
ondbclick = "■";      :マウスをダブルクリックすると■を実行する
onmouseover = "■";   :マウスが領域内に入ったとき■を実行する
onmousemove = "■";   :マウスが領域内を動いた時■を実行する
onmouseout = "■";    :マウスが領域内から出たとき■を実行する

■ ・・・・実行する命令

命令の使い方

<タグ onmousedown = "■">
<タグ onmouseup = "■">
<タグ onclick = "■">
<タグ ondbclick = "■">
<タグ onmouseover = "■">
<タグ onmousemove = "■">
<タグ onmouseout = "■">
■ ・・・・実行する命令

テキストに命令をつける
テキストに命令をつける場合は、何も機能が無い<SPAN>を使う。
例)<SPAN onclick="■">文字列</SPAN>

 

【CGI講座のまとめ】

CGIとSSI

CGIとSSIは基本的には同じようなプログラム。
CGIはそれ自身をブラウザに表示するのに対し、SSIはHTMLなどの中に埋め込んでプログラムを実行できる。

CGIプログラムの基礎

CGIは(メモ帳など)テキストエディタを使って作ることができる。

Perl処理系を書く

CGIプログラムの初めには必ず、
#!user/local/bin/perl
という1行を書く。
これはPerlを動かすための場所を指定している。
Perlはブラウザ上では実行できないので、指定された場所に「Perlを動かしてください」と頼んでいる。
それによって、その場所でPerlが実行される。

 

【特別講座のまとめ】

関数

同じ処理を何度も行う場合、ひとかたまりの処理に名前を付けておく。
それを関数という。

例)クイズ
クイズの処理は、

 問題1 ⇒ 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理
 問題2 ⇒ 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理
 問題3 ⇒ 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理
 問題4 ⇒ 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理
 問題5 ⇒ 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理

となる。
ここで、
 答える ⇒ 正解・不正解の判定 ⇒ 点数の処理
という部分は全て同じので、それらを1つの「クイズの処理」という名前にする。
すると、さっきのプログラムは、

 問題1 ⇒ クイズの処理
 問題2 ⇒ クイズの処理
 問題3 ⇒ クイズの処理
 問題4 ⇒ クイズの処理
 問題5 ⇒ クイズの処理

となり、簡単になる。
これが関数の考え方。
もっと複雑なプログラムになると、関数がとても役に立つので必ず覚えておくこと。

 


go_back.gif (244 バイト) 戻る