落葉の作成資料

 

準備

下記基本の形をコピーしてテラパッド(メモ帳)に貼り付ける。

名前を付けて保存 main.html

 

準備

自動生成された代替テキスト:

Otiba.jsともみじ他画像を一括ダウンロード

 

準備

画像2枚 01.Jpg02.jpg

 

準備

homu.gif,  bgmを挿入する時***.mid,  ***.js

 

フォルダの中

準備したものすべて入れる

main.htmlotiba.js,もみじ他画像、01.jpg,02.jpg,

homu.gif,***.js,***.mid

1)基本の形

<html>
<head>
<title>
タイトル名</title>
</head>
<body>
ここから本文


</body>
</html>

 

 2)本文の入力

 

  タイトル

  文字入力

  画像ロールオーバー

ここから本文〜この文章を削除して下記を入力する。

 

<center>

<h2>タイトル入力</h2>

<p>文字入力 </p>

 

<img src="01.jpg" onmouseover ="this.src='02.jpg'" onmouseout ="this.src='01.jpg'" width="600" height="450" border="0">

</center>

 

大きい画像1枚の時<img src="03.jpg">

3)落葉ソース

自動生成された代替テキスト:

落葉ソース挿入は<body></body>の間に

コピーしてテラパッドに貼り付ける。

 

main.htmlの出来上がりです。

文字

<font size=数値>文字</font>

文字の色を変える

 

<font size=数値>文字</font>

文字のサイズを変える

文字のサイズは数値(1から7まで)を使用

17の数字ではなく、-3+3でも変わります。

 

<font face="フォント名">文字</font>
文字(フォント)の種類を変える

 

 

<font size=4 color="#000077" face="MS 明朝"> 文字</font>

 

背景

背景

<body bgcolor=""> 背景に色を入れる時    

<body background="絵のファイル名">  背景に画像を入れる時

 

場所body後に色を入力する

<body bgcolor="#cccc99">

 

<center>

</center>

本文や画像を中心にする

<center>本文の最初に入れる

 

</center>本文の最後に入れる

</body>この前に入力

 

タイトル

タイトル

<h数値>タイトル入力</h数値>  

見出しにはいろいろな大きさが有ります

大きさは数値(1から6まで)を変えると変わります

上下に1行空白が入ります

 

(例)<h2>タイトル入力</h2>

 

ロールオーバー

ロールオーバー

<img src="最初に表示する画像のURL"

onmouseover="this.src='マウスが重なった時に表示する画像のURL'"

onmouseout="this.src='マウスが離れた時に表示する画像のURL'">

 

画像サイズ600×450で名前01.jpg02.jpgにしたとき

 

<img src="01.jpg" onmouseover ="this.src='02.jpg'" onMouseout="this.src='01.jpg'" width="600" height="450" border="0">

 

onMousemoveと記載してましたがonmouseoverに訂正しました。

通常はonmouseoverを使用した方が良いとのこと。

<p> </p>

右寄せ、中央寄せ、左寄せは<p> </p>の部分で設定します。

<br>の改行しないでも前後に空白が出来ます。

 

<p> </p>の間は一つのブロックで、そのブロック全てが同じ寄り方になります。

左寄せ

<p align="left"> </p>

中央寄せ

<p align="center"> </p>

右寄せ

<p align="right"> </p>

 

<p>インタラクティブ編の風流な『落葉』から<br>

プログラムともみじ他画像をダウンロードしました。</p>

 

 

リンク

自動生成された代替テキスト:

<a href="url"><img src="***.gif"  border="0"></a>

 

ダウンロードしたHPのアドレスと画像

<a href="http://plusone.jpn.org/javascript/" target="_blank"><img src="psj_logo2.gif"  border="0"></a>

 

<a>の中に target="_blank" を入れると新しいウィンドウでページを開くことが出来ます。

 

落葉ソース

下記ソース挿入は<body></body>の間に

 

<!-- 壁紙動画 ここから -->

<div style="font-size:10px;text-align:center;">

<script type="text/javascript" src="otiba.js"></script>

<a href="http://plusone.jpn.org/javascript/" style="text-decoration:none;" target="_blank">javascript</a></div>

<!-- 壁紙動画 ここまで -->

 

 

 

 

inserted by FC2 system