スタイルシート、電子メールの転送、Emacs write-file

					2018年05月18日
情報科学類 コンピュータリテラシ

                                       筑波大学 システム情報系
                                       新城 靖
                                       <yas@cs.tsukuba.ac.jp>

このページは、次の URL にあります。
http://www.coins.tsukuba.ac.jp/~yas/coins/literacy-2018/2018-05-18
あるいは、次のページから手繰っていくこともできます。
http://www.coins.tsukuba.ac.jp/~yas/
http://www.cs.tsukuba.ac.jp/~yas/

■連絡事項

次回 5月22日火曜日は、講義室 3A209 に集合。

■スタイルシート

HTML は、「本来は」、文書の構造を記述する。

HTML で記述できる文書の構造:

ヘッダ（文書の題目）
見出し、章立ての木構造
段落
箇条書
表

HTML では、文書の構造を記述することができるが、「表示の方法」を記述することは、本来はでない。ワープロは、紙に印刷した時の、このような表示の方法を設定するためのプログラムである。

表示の方法:

文字フォントの種類、大きさ、色
行間
左詰め、中央寄せ、右詰め

表示の方法を記述するには、スタイルシートを用いる。

Cascading Style Sheets (CSS)
eXtensible Stylesheet Language (XSL, XML用)
その他

◆XML (eXtendible Markup Language)

XML は、タグが定義できるマークアップ言語（＜－＞HTMLはタグが固定）。プログラム間でデータの交換に用いる。

■カスケーディング・スタイルシート

◆例。青い H1 タグの見出し

H1の見出しを青くする。

<HTML>
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html;charset=iso-2022-jp">
<TITLE>スタイルシートの例題:タグへの設定</TITLE>
<STYLE TYPE="text/css"><!--
H1 { color: blue; }
--></STYLE>
</HEAD>

<BODY>

<H1>青いH1の見出し</H1>

<H2>普通のH2の見出し</H2>

</BODY>
</HTML>

[表示例]

◆カスケーディング・スタイルシートで記述できること

段落書式

行揃え。text-align:, text-justify:
表示範囲。height:, width:, overflow:, text-overflow:,
余白。 margin:, margin-left:, margin-right:, margin-top:, margin-bottom:
表示位置。position:, top:, bottom:, left:,
境界。border-style:, border-width:, border-color:, padding:

文字書式

色。color:, background-color:
フォント。font: font-family:
大きさ。 font-size:
その他。font-style:, font-weight:, text-decoration:

箇条書き

印の形状。list-style-type:, list-style-image:
印の位置。list-style-position:

イメージ

枠線。border-style
テキストとの位置。float:, clear:, vertical-align:, margin-right:
ズーム。zoom:
背景。background-image:, background-repeat:, background-position:

その他:

カーソルの形状。 cursor:
表示(非表示)。visibility:, display:
内容の自動挿入。content:

◆スタイルシートを書く場所

(1) HTML のヘッダ

<HTML>
<HEAD>
<TITLE>タイトルです。</TITLE>
<STYLE TYPE="text/css"><!--
(ここにスタイルシートを書く)
--></STYLE>
</HEAD>

(2) 別のファイル

「スタイルシートのURL」は、filename.css のようなファイル名が多い。

<HTML>
<HEAD>
<TITLE>タイトルです。</TITLE>
<LINK rel="stylesheet" type="text/css" href="スタイルシートのURL">
</HEAD>

<HTML>
<HEAD>
<TITLE>タイトルです。</TITLE>
<STYLE TYPE="text/css"><!--
@import url(スタイルシートのURL);
(別ファイルに加えてここにもスタイルシートを書くことができる)
--></STYLE>
</HEAD>

(3) HTML のタグの属性

<P STYLE="color:blue">文。文。文。</P>

◆カスケード

複数のスタイルは、混ぜられる（カスケード）。対立する定義は、後から出てきた方が有効になる。

◆コメント

コメントとは、あるコンピュータ言語の中に記述する、人間が読むために書かれた部分。 CSS では、/* と */ で括った部分がコメントとなる。この表記法法は、Ｃ言語やＪａｖａ言語と似ている。（他の言語では、この表記法は使えないことがある。）コメントは、デバッグ時など一時的にコンピュータ言語の機能を無効にしたい時にも使える。

◆基本的な文法

次のような規則の並び

セレクタ  { 宣言;  }
セレクタ, セレクタ, ..., セレクタ { 宣言;宣言;宣言;  }

１つひとつの宣言は、次の形式。

プロパティ:式

「式」には、数、文字列、%、単位つきの長さ、URL などが書ける。

◆書式の有効範囲(セレクタ)

HTML の要素(タグ)ごと。<H1>,<H2>,<H3>,<P>,<BODY>など例:
```
H1 { color: blue; }
```

ID(identifier)ごと。文書全体で１回だけ現れる。

#n10          { color:blue; }  /* id="n10" と指定したものだけ */
...
<H1 id="n10"> .... </H1>

クラス(class)ごと。クラスとは、似たような要素の集まり。同じクラスの要素は、似たような書式になる。文書全体で複数現れる。

◆クラスの利用例

<HTML>
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html;charset=iso-2022-jp">
<TITLE>スタイルシートの例題:クラスの利用</TITLE>
<STYLE TYPE="text/css"><!--
.important    { color:red; }  /* class="important" と指定したものだけ */
--></STYLE>
</HEAD>

<BODY>

<H1>普通のH1の見出し</H1>

<P>
普通のパラグラフ
</P>

<P class="important">
重要なパラグラフ
</P>

<H2>普通のH2見出し</H2>

<H2 class="important">重要な普通のH2見出し</H2>

<P>
普通の言葉。<SPAN class="important">重要な言葉。</SPAN>普通の言葉。
</P>

</BODY>
</HTML>

[表示例]

◆WWWページデザインの手順

HTML で全部の表示したい内容を記述する。
スタイルシートを埋め込み、見栄えを調整する。

スタイルシートをうまく活用すると、見た目を一度に調整できる。

同じスタイルシートを複数のページで読み込んで使う。
同じページ内でも class をうまく活用する。

いちいち <font> で指定すると、変更したくなった時には、全部変えなければならない。 <span class="classname">のように、クラスを使ってマークしておけば、１個所クラスの設定を変更するだけで全部統一的に変る。 (同様に、ワード・プロセッサでも、スタイルをうまく活用したい。)

注意点

ブラウザによって対応していない場合がある。
対応していても、動作が異なる場合がある。バグも多い。

複数のブラウザ（違うバージョンも含む）で表示を確認したい。

◆CSSクラスと<DIV>タグや<SPAN>タグ

HTMLのタグ、<DIV> (division) と<SPAN> は、グループ化するためのタグ。<SPAN>は、1行以内の短い範囲、 <DIV>は、<P>、<H1>、 <H2>、<H3>、<H3>、<UL>、 <OL>等を含むことができる。

CSSのクラスは、しばしば <DIV>タグや<SPAN>タグとともに利用される。

◆HTML/CSSにおける16進数による色の指定

HTML/CSS で色を指定する方法としては、色の名前を使う方法の他に16進数を用いることもできる。

H1 { color: blue; }

H1 { color: #0000ff; }

色は、# + 16進数6桁で表す。
6桁は、Red 2桁、Green 2桁、Blue 2桁で、各色 00からffの値を取る。
#0000ff は、Red=0, Green=0, Blue=ff とは、青が最高値で光り、赤と緑は光らないことを意味する。
#000000 は、黒、#ffffff は白を意味する。
色の名前は、大文字で書いても小文字で書いても同じ。

[表示例]

https://www.w3.org/TR/html40/types.html参照。

HTML ではできないが、CSSでは、次の方法も有効。

H1 { color: rgb(0,0,255); }/* 0 から 255 */

H1 { color: rgb(0%,0%,100%); }/* 0% から 100% */

◆その他のCSSの利用例

その他、次のページが参考になる。

■~/.forwardによる電子メールの転送

The Unix Super Text 25.9.1 参照。メール・リーダの操作には、受け取ったメールを他のユーザへ 転送(forward) する操作がある。それとは別に、届いたメールをユーザの操作を介さずに自動的に他のアドレス（普通は他のホストにある別の自分の電子メール・アドレス）に転送する機能がある。この機能を使うには、ホーム・ディレクトリの下の

~/.forward

というファイルに、転送先のアドレスを書く。たとえば、 shiro@himalaya.is.tsukuba.ac.jp に届いたメールを全て shiro@alps.is.tsukuba.ac.jp に転送したいとする。この時、 himalaya の方のホーム・ディレクトリの下の ~/.forward に次のように書く。

shiro@alps.is.tsukuba.ac.jp

単純に転送先のアドレスを書く方法では、~/.forwardがあるホストには、何も残らないが、コピーを残しながら、転送する方法もある。それには、次のように自分のログイン名に\を付けたアドレスを含める。

\shiro, shiro@alps.is.tsukuba.ac.jp

注意:「\」は、ASCII 「5c(16進数)」である。「＼」と表示されたり「￥」と表示されることがある。「／」ではない。

この例では、himalaya に届いた電子メールは、himalaya というホストの \shiroというユーザの 配送プログラム用メール・ボックスに入り、さらに、shiro@alps.is.tsukuba.ac.jp にも送られる。

転送におけるループの危険性

複数のメール・アドレスがある人は、どのホストにログインした時にも、全部のホストに届いた電子メールが読める状態にしたいと思うかもしれない。上の例では、 alps にログインした時にも、 alps と himalaya の両方のメールが読め、また、himalaya にログインしてもやはり alps と himalaya の両方のメールが読めると便利に思えるかもしれない。しかし、こうすることは技術的に難しいので、しばらくはあきらめて欲しい。

\loginnameの機能をつかっても、なかなかうまくいかない。たとえば、次のような ~/.forward を作成したと考える。(実際に実行すると危険なので、考えるだけする。)

(alps:~/.forward)
\shiro, shiro@himalaya.is.tsukuba.ac.jp

(himalaya:~/.forward)
\shiro, shiro@alps.is.tsukuba.ac.jp

この状態で、shiro@alps.is.tsukuba.ac.jp にメールが届いた場合、次のようなことが起る。

alps にコピーが残され、かつ、 shiro@himalaya.is.tsukuba.ac.jp に送らる。
himalaya では、やはり、コピーが残され（ここまでは順調）、さらに、shiro@alps.is.tsukuba.ac.jp に送られる（！）。
alps では、コピーが残され（２回目）、himalaya に送られる。
himalaya では、コピーが残され（２回目）、さらに、shiro@alps.is.tsukuba.ac.jp に送られる。
alps では、コピーが残され（３回目）、himalaya に送られる。
himalaya では、コピーが残され（３回目）、さらに、shiro@alps.is.tsukuba.ac.jp に送られる。
alps では、コピーが残され（４回目）、himalaya に送られる。
himalaya では、コピーが残され（４回目）、さらに、shiro@alps.is.tsukuba.ac.jp に送られる。
...

このような電子メールのピンポンが、永遠に続く。実際には、電子メールの転送には上限が設定されているので、その上限に達した段階でエラーになって止る。

３ヵ所以上でこの設定をしたとすると、中継される度にメールが増殖する。

\loginname の機能を使っていなかったとすると、コピーは残らないが、メールが行き来するだけで、どこにも届けられずにエラーになる。

~/.forward の設定をしたら、必ず自分で自分あてに電子メールを出して届くかテストすること。~/.forward の設定を間違えると、エラーのメールも届かなくなるので、エラーが起こっていることさえわからなくなる。

~/.forward の機能は、もともとは、sendmail という種類のMTA の機能である。他の MTA (qmail, postfix)でも使えるように設定していることが多い。

◆筑波大学全学計算機の転送機能

筑波大学全学計算機の電子メール機能( @s.tsukuba.ac.jp )には、転送機能がある。練習問題全学計算機の転送機能参照。

◆電子メールをプログラムに転送する

The Unix Super Text 25.9.2 参照。 ~/.forward の応用として、他のアドレスに電子メールを転送するのではなく、（サーバ上で実行される）プログラムに転送する機能がある。すなわち、（サーバ上で）プログラムを実行して標準入力に電子メールの内容を与えるという機能がある。これには、次のように~/.forwardに書く。

"| /program/path/name arg1 arg2 arg3 ... argn"

このように、| に続いて、プログラムのパス名と引数を書き、全体を "" で括る。

この機能を使って、受け取った電子メールを自動的に分類したり、 spamメールを排除したりすることができる。たとえば、MH の slocalやprocmail と呼ばれているプログラムがこの機能を使っている。

■Emacs

◆カーソル移動

矢印キー（←、→、↑、↓）だけでなく、次のキーを使えるようにする。

C-b	backward-char
C-f	forward-char
C-p	previous-line
C-n	next-line

C-v	scroll-up       	次のページへ移動
M-v	scroll-down     	前のページへ移動
M-<	beginning-of-buffer	ファイルの先頭へ移動
M->	end-of-buffer   	ファイルの末尾へ移動

M-v は、 Esc v、つまり、Esc キーを打ち、(Esc キーを離し)、v キーを打つ。

◆ファイルの編集の基本

C-x C-f find-file
既存のファイル名、または新しいファイル名の入力
編集
C-x C-s save-buffer
C-x C-c save-buffers-kill-emacs (終了)

◆別のファイルへ保存

読み込んだファイルとは別のファイルに保存することができる。

C-x C-f find-file
既存のファイル名の入力
(編集)
C-x C-w write-file
新しいファイル名の入力
編集
C-x C-s save-buffer
C-x C-c save-buffers-kill-emacs (終了)

前回のレポートを修正する時に便利。早めに C-x C-w で書き込むことを奨める。さもないと元のファイルを壊してしまうことになる。

類似のことは、cp コマンド等で元のファイルを別のファイルにコピーしてから、別のファイルを Emacs で修正してもできる。

■実習

実習時間中には、以下の課題をできるだけ多く行いなさい。全部を行う必要はない。

★練習問題(1001) ことえりのバックスラッシュ入力

手引き 6.2 参照

次のようにして、「ことえり」の設定を確認しなさい。そして、キーボードの「￥」でバックスラッシュが入力されるように設定しなさい。

一番上のメニューバーの右上の「A」または「あ」と表示されている部分を押し、メニューを表示し、そこから「"ことえり"環境設定をひらく」を選ぶ。
「入力ソース」タブの左側のウィンドウの中から「ことえり」を選ぶ（１つしか表示されていない時には、「ことえり」が選ばれていることを確認する）。
右側のウィンドウは、一部しか表示されていない。スクロールして下の部分にある「"￥"キーで入力する文字」として、「＼（バックスラッシュ）」を選ぶ。
(クリックで拡大)

★練習問題(1002) .forwardの設定と確認

この練習問題をする前に、必ず ~/.forwardによる電子メールの転送を読み、働きと危険性を理解しなさい。失敗すると、電子メールが失われたり、メールサーバに過大の負荷をかけることになる。

coins 以外に日常的に読み書きするメール・アカウントがある人は、毎日 coins に届いたメールを確認する方法として~/.forward を設定して、転送する方法が考えられる。そのようにしたい人は、そうしなさい。

~/.forward は、emacs でテキスト・ファイルとして作成するとよい。

$ emacs ~/.forward 
$ cat ~/.forward 
\s1854321, myaddr@xxx.yyy.zzz
(これは一例なので真似しないように)
$

設定が完了したら、必ず自分自身の coins のアドレス (例えば学生番号が 201854321 なら s1854321@coins.tsukuba.ac.jp)にメールを書き、次のことを確認しなさい。

coins で(ThunderbirdやWebメール)でメールが読める。
転送先でメールが読める。
メールがループしない

★練習問題(1003) Emacsの復習

Emacs で、ファイルを作成する方法を復習しなさい。

方法1: 引数にファイル名を与える方法。

「emacs filename.txt」で実行する。存在しないファイルを選べば、新規作成として扱われる。
編集作業を行う。ファイルの内容を打ち込む。カーソル移動。
C-x C-sで保存
C-x C-cで終了

方法2: 実行後にファイル名を与える方法

「emacs 」を引数なしで実行
C-x C-fで、編集したいファイルを選ぶ。存在しないファイルを選べば、新規作成として扱われる。
編集作業を行う。ファイルの内容を打ち込む。カーソル移動。
C-x C-sで保存
C-x C-cで終了

★練習問題(1004) Emacs emacs、タブキーによる補完機能

練習問題 emacs、タブキーによる補完機能を行いなさい。

★練習問題(1005) Emacs 他のファイルへの保存

Emacs で別のファイルへ保存する機能を練習しなさい。

「emacs 」を引数なしで実行
C-x C-fで、元のファイルを選ぶ。
C-x C-wで、別の(新しい)ファイルを選ぶ。存在しないファイルを選べば、新規作成として扱われる。
編集作業を行う。ファイルの内容を打ち込む。カーソル移動。
C-x C-sで保存
C-x C-cで終了

★練習問題(1006) Emacs、カットの復習

Emacsのカット＆ペースト、コピー＆ペーストの機能を用いて、カット機能を使って大量のテキストを削除してみなさい。この機能は、次のような時に有用である。

似たようなテキストファイルを作成する時に、まずファイルをコピーする。次に、コピーしたファイルから、必要な部分を残し、不要な部分を削除する。
コンピュータリテラシのレポートのファイルを作成する時に、まず前回提出したレポートをコピーする。先頭の学籍番号や名前の部分だけを残し、残りの部分を削除する。

カットの練習をする時には、まずファイルをコピーする必要がある。ファイルをコピーするには、次のような方法がある。

cp コマンドでコピーする。

$ ls -l literacy-a5.txt 
-rw-r--r--  1 yas  prof  1990  5  8 21:17 literacy-a5.txt
$ ls -l literacy-a6.txt 
ls: literacy-a6.txt: No such file or directory
$ cp literacy-a5.txt literacy-a6.txt 
$ ls -l literacy-a6.txt 
-rw-r--r--  1 yas  prof  1990  5  8  21:17 literacy-a6.txt
$

練習問題 Emacs 他のファイルへの保存の手法を使う。
その他

Emacs でカットを行うには、次のようにする。

削除したいテキストの先頭にカーソルを移動させる。
C-SPC、または、C-@ でマークを設定する。
削除したいテキストの末尾にカーソルを移動させる。
C-wでカットする。

C-SPC でマークを設定できない場合には、 Spotlight のショートカット・キーの解除を試しなさい。

★練習問題(1007) Firefoxのウィンドウ

Firefox で複数のページを同時に表示するには、ウィンドウが便利である。たとえば、講義のページを表示しながら、自分が作成中のページを表示する時に、この機能を使うと便利である。このことを確認しなさい。

「ファイル」メニューから「新規ウィンドウ」を選ぶ

★練習問題(1008) Firefoxのタブ

Firefox で複数のページを同時に（切り替えながら）表示するには、タブが便利である。このことを確認しなさい。

「ファイル」メニューから「新規タブ」を選ぶ
タブを切り替えるには、ウィンドウの上部にあるタブのタイトルの部分をクリックする。

★練習問題(1009) CSSの観察

自分がよく見る WWW ページについて、スタイルシートが使われているかを観察しなさい。 Firefoxブラウザを操作して、元の HTML (ソース)を表示させなさい。

観察したいページを開く。
ページのソースを表示する。
「表示」メニューから「ページのソース」を選ぶ。
HTML の記述の上部の <head> の中に<style>や <link rel="stylesheet" ..>の記述がないかを調べる。

★練習問題(1010) 学類コンピューティング環境が利用しているCSS観察

学類コンピューティング環境のページで利用されているスタイルシートを表示しなさい。そして、どのような機能が利用されているかを調べなさい。

http://www.coins.tsukuba.ac.jp/ce/,学類コンピューティング環境のページ を開く
ページのソースを表示する。
<head>にある <link rel="stylesheet"...> の href を得る。これは、相対形式になっている。 ( "skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color=" )
これに、元のページの URL を合わせて、絶対形式に変換する。 http://www.coins.tsukuba.ac.jp/ce/に "skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color=" を合わせて
http://www.coins.tsukuba.ac.jp/ce/skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color= となる。
こうして得られた URL を、Web ブラウザのURL が表示されている所(ロケーション・バー) に打ち込み、リターンキー(エンターキー)を押す。

★練習問題(1011) スタイルシートの記述(タグ)

授業で用いた例題「例。青い H1 タグの見出し」のソースを表示しなさい。

端末で次のように lv コマンドを実行する。

$ lv ~yas/public_html/htdocs/coins/literacy-2018/2018-05-18/blue-h1.html

[リンク] を、Firefox のウィンドウやタブで開く。

ヘッダにある次のような記述を確認しなさい。

<STYLE TYPE="text/css"><!--
H1 { color: blue; }
--></STYLE>

この記述を、自分自身が作成した HTML ファイルに含めてみなさい。自分自身が作成した HTML ファイルで、H1 タグを使っていない人は、他のタグを変更しなさい。

★練習問題(1012) スタイルシートの記述(クラス)

授業で用いた例題「クラスの利用例」のソースを表示しなさい。

端末で次のように lv コマンドを実行する。

$ lv ~yas/public_html/htdocs/coins/literacy-2018/2018-05-18/important.html

[リンク] を、Firefox のウィンドウやタブで開く。

ヘッダにある次のような記述を確認しなさい。

<STYLE TYPE="text/css"><!--
.important    { color:red; }  /* class="important" と指定したものだけ */
--></STYLE>

この記述を、自分自身が作成した HTML ファイルに含めてみなさい。さらに、次のように、タグに class 属性を加えてみなさい。

<P class="important">
...
<H2 class="important">重要な普通のH2見出し</H2>
...
<SPAN class="important">重要な言葉。</SPAN>

★練習問題(1013) 筑波大学全学計算機の転送機能

筑波大学全学計算機の電子メール機能( @s.tsukuba.ac.jp )には、転送機能がある。この機能の設定方法を確認しなさい。

必要に応じて、設定しなさい。ただし、転送におけるループの危険性を理解した上で、ループが起きないよう設定しなさい。

■課題10 スタイルシート、電子メールの転送、Emacs write-file

以下の問題、および、回答をテキスト・ファイルに記述し、レポート提出ページから提出しなさい。

(1) 電子メールの転送について、当てはまる行の先頭に yes, 当てはまらない行の先頭に no と記述しなさい。

(a) coins 以外に電子メールのアカウントがある。
(b) coins のメールを毎日読む。
(c) ~/.forward の機能を理解した。
(d) ~/.forward を設定した。
(e) ~/.forward を設定し、メールを出してみてテストをし、かつ、意図した通りに動作することを確認した。
(f) 複数の場所で転送機能を設定した。
(g) 複数の場所で転送機能を設定し、かつ、それらの間でループがある。

~/.forward を設定した人は、その内容を insert-file 等でレポートに含めなさい。練習問題 .forwardの設定と確認参照。

(2) 情報科学類の学生は、coinsに届いたメールを毎日確認することが期待されている。あなた自身がどのようにして毎日確認するかを書きなさい。

(3) HTML と CSS で次のような条件を満たす WWW ページを作成しなさい。

課題9(1)の条件をすべて満たす。（同じページを、提出してもよい。）
２つ以上のタグのスタイルを変更する。そのうち１つ以上は、class を使う。
同じ class のスタイルを、２個所以上で利用する。２カ所としては、１つのHTML文書の内部でもよく、また複数の HTML 文書にまたがっていてもよい。

作成した WWW ページの URL (http:// から始まるもの)をレポートに含めなさい。なお、この提出する WWW ページは、ホーム・ページでなくともよい。

練習問題スタイルシートの記述(タグ)、練習問題スタイルシートの記述(クラス)参照

(4) 次の Web ページを読みなさい。

アクセス制御、暗号、SSL、SSH、Webサーバ・アクセスログ

そして、項目についてついて調べて、簡単に説明しなさい。

盗聴
悪意のある人が他人に成り代わる行為
共有鍵暗号方式と公開鍵暗号方式の相違点
メッセージ要約関数（メッセージダイジェスト関数）
公開鍵暗号系を使ったディジタル署名で、情報を受け取った側が行うこと
rsh, rlogin コマンドを暗号の仕組みで安全にしたコマンド

(5) 新Linux/UNIX入門の次の部分を読みなさい。

09章ファイルのアクセス制御
12章ユーザーとグループの操作
01-003 UNIXの小知識
05-027 節ファイルを削除不可にする

そして、項目について調べて、簡単に説明しなさい。

rw-r--r-- を8進数で表現したもの
chmod の u
chmod の g
chmod の o
ユーザーを変更し、別のユーザでログインしたかのごとくシェルを実行するコマンド
id コマンド
スーパーユーザ

(6) [加点] (3) で、このページの説明の範囲を超えたスタイルシートの機能を 3つ以上、利用しなさい。そして、各機能の説明、どこに利用しているか、および、その機能の有用性を書きなさい。( CSSの利用例や、その他のCSSの利用例で紹介されているものを利用してもよい。)

各機能が有効となる Web ブラウザの種類を 3 つ以上示しなさい。

各機能が有効ではない Web ブラウザの種類を 2 つ以上示しなさい。この場合でも、作成したスタイルシートを含むページの内容がアクセスできることを確認しなさい。

(7) [加点] macOS にはないが、Linux を含むUnix 系の OS では、vacation というコマンドが用意されている。この機能を使うと、長期間不在になる時に電子メールを受け取った時に自動的に返信する。これは、電子メールをプログラムに転送するを使っている。

vacation の機能を使う時に、~/.forward にどのように記述すれば良いかを示しなさい。ただし、coins で実際に記述する必要はない。

vacation 以外に、電子メールをプログラムに転送するを使うことができるプログラムを 2 つ以上探しなさい。各プログラムについて、次のことを調べなさい。

プログラムの名前
プログラムの機能
設定方法。ただし、coins で実際に設定する必要はない。

Last updated: 2018/05/18 10:53:17

Yasushi Shinjo / <yas@cs.tsukuba.ac.jp>

スタイルシート、電子メールの転送、Emacs write-file

■連絡事項

■スタイルシート

◆XML (eXtendible Markup Language)

■カスケーディング・スタイルシート

◆例。青い H1 タグの見出し

◆カスケーディング・スタイルシートで記述できること

◆スタイルシートを書く場所

◆カスケード

◆コメント

◆基本的な文法

◆書式の有効範囲(セレクタ)

◆クラスの利用例

◆WWWページデザインの手順

◆CSSクラスと<DIV>タグや<SPAN>タグ

◆CSSのセレクタ

◆CSSの利用例

◆HTML/CSSにおける16進数による色の指定

◆その他のCSSの利用例

■~/.forwardによる電子メールの転送

転送におけるループの危険性

◆筑波大学全学計算機の転送機能

◆電子メールをプログラムに転送する

■Emacs

◆カーソル移動

◆ファイルの編集の基本

◆別のファイルへ保存

■実習

★練習問題(1001) ことえりのバックスラッシュ入力

★練習問題(1002) .forwardの設定と確認

★練習問題(1003) Emacsの復習

★練習問題(1004) Emacs emacs、タブキーによる補完機能

★練習問題(1005) Emacs 他のファイルへの保存

★練習問題(1006) Emacs、カットの復習

★練習問題(1007) Firefoxのウィンドウ

★練習問題(1008) Firefoxのタブ

★練習問題(1009) CSSの観察

★練習問題(1010) 学類コンピューティング環境が利用しているCSS観察

★練習問題(1011) スタイルシートの記述(タグ)

★練習問題(1012) スタイルシートの記述(クラス)

★練習問題(1013) 筑波大学全学計算機の転送機能

■課題10 スタイルシート、電子メールの転送、Emacs write-file