TITLE:第10回の課題(1) *課題(1): スタイルシートの切り替えの準備をする [#be0dc49c] > HTMLファイルを編集して、 スタイルシートを切り替えるプログラムを追加します。 < **スクリプトをHTMLファイルに組み込む [#q0f6a98b] スタイルシートを指定した link タグ内に id="cssid" の属性を書き加えます。 </head>の直前にスクリプト(プログラムの一種)を書き加えます。 スクリプトのみ別ファイルに用意したので、 下のリンクをクリックしてください。これはコピーして使ってかまいません。 -[[スタイルシートを切り替えるスクリプト>./script]] 修正結果は、次のようになります。 #ref(script1.png,nolink,スクリプト) **切り替えのためのタグを記述する [#h3d4abee] タイトルと目次の間、 またはプロフィールの次あたりにスクリプトを使うためのタグを追加します。 #pre(novervatim){{ <a onclick="replace_css('cssid','CSSファイルの名前');">基本</a> COLOR(red):(注:「CSSファイルの名前」には、前回までの課題のCSSファイルを入力してください) }} これは「基本」という文字をクリックしたら、スタイルシートを前回までの課題のCSSファイルに切り替えるという意味になります。 「基本」という文字の部分は別の言葉に変えてもかまいません。他の箇所は変更しないでください。 さらに次の2行を追加します。 #pre(novervatim){{ <a onclick="replace_css('cssid','0612学籍番号.css');">第10回</a> <a onclick="replace_css('cssid','');">なし</a> COLOR(red):(注:「学籍番号」には、自分の学籍番号(c2062XXX)を入力してください) }} 「第10回」という文字をクリックしたら、 スタイルシートを「学籍番号_9.css」に切り替え、 「なし」をクリックするとスタイルシートを使わない表示になります。 ---- &navi2(Lecture/JouhouC2007/10th,next);に進んでください。 &br; ---- #navi2(Lecture/JouhouC2007/10th,prev,toc,next) |