しゃぼん玉 作成資料

 

画面全体に画像を入れる。

MARQUEEタグで文字の移動。

JavaScriptでシャボン玉が動きます。

 

画面全体に画像を入れる時 <body  background="a.jpg">

準備

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

名前を付けて保存 main.html

 

準備

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

imgmoveprog.jsbuble1.png, buble2.png 画像をダウンロード

 

準備

画像1枚 横1400ピクセル  a.jpg

 

準備

ホームボタンとBGM 第8回ホームページ勉強会3日と第9日講座で説明がありました。

homu.gifbgm_button.js***.mid

 

フォルダの中

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

main.htmlimgmoveprog.js, buble1.png, buble2.png

a.jpg, homu.gif,  ***.mid,  ***.js

 

1)基本の形

<html>
<head>
<title>
タイトル名</title>
</head>
<body
 background="a.jpg">
ここから本文

 

</body>
</html>

 

2)次に

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

 

<center>

<h2>文字入力</h2>

 

<p >

<MARQUEE width="300" scrollamount="4" bgcolor="#f0f0f7" >

シャボン玉を飛ばしました</MARQUEE>

</p>

</center>

 

 

文字

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

文字のサイズを変える

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

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

 

<font color="#000099">文字</font>

文字の色を変える

 

<font face="フォント名">文字</font>

文字(フォント)の種類を変える

MS 明朝,MSゴシック、HGS行書体、江戸勘亭流 

 

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

 

<b>太文字</b>

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

 

 

ホームページ道具箱のカラーコード表

 

 

背景

背景

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

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

 

場所body後に色を入力する

<body bgcolor="#cccc99">

<center>

</center>

本文や画像を中心にする

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

 

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

</body>この前に入力

タイトル

タイトル

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

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

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

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

 

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

<p> </p>

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

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

 

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

左寄せ

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

中央寄せ

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

右寄せ

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

 

<p>シャボン玉を飛ばしました</p>

<MARQUEE>

</MARQUEE>

下の表を見てあなたのお好みにかえてみましょう。

 

文字を表示する

width="300"

文字を表示する

height="40"

移動する量

scrollamount="4"

移動するスピード

scrolldelay="100"

表示する画像

src="b.gif" 

背景の色つき

bgcolor="#f0f0f7"

文字の色

color="#0000cc"

文字の大きさ

font-size="4"

 

その他の動き参考

MARQUEE

 

例1

<MARQUEE>シャボン玉を飛ばしました</MARQUEE>

 

例2

<MARQUEE width="300">横幅を決める</MARQUEE>

 

例3

<MARQUEE width="300" scrollamount="4" bgcolor="#f0f0f7" >

シャボン玉を飛ばしました</MARQUEE>

 

例4

<MARQUEE width="300" scrollamount="4" bgcolor="#f0f0f7" >

<FONT size="3" color="#0000cc"><b>シャボン玉を飛ばしました</b></FONT></MARQUEE>

 

 

 

inserted by FC2 system