授業日誌　5/21　Dreamweaverでformの挿入 

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8">
<title>Dreamweaverでformの挿入</title>
</head>
<body>
<form action="#" method="post" name="form1">
<table width="500" border="1">
<tr>
<th>お名前</th>
<td><input type="text" name="name" size="30"></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="text" name="email" size="50"></td>
</tr>
<tr>
<th>性別</th>
<td><label>
<input type="radio" name="sex" value="1" checked>男性</label>
<label><input type="radio" name="sex" value="2">女性</label>
</td>
</tr>
<tr>
<th>勉強したい項目</th>
<td><label><input type="checkbox" name="item" value="1">CSS</label>
<label><input type="checkbox" name="item" value="2">Flash</label>
<label><input type="checkbox" name="item" value="3">HTML</label>
<label><input type="checkbox" name="item" value="4">PHP</label>
</td>
</tr>
<tr>
<th>お住まいの地域</th>
<td>
<select name="area">
<option value="" selected>下記よりお選びください</option>
<option value="1">北海道</option>
<option value="2">東北</option>
<option value="3">関東</option>
<option value="4">中部</option>
<option value="5">関西</option>
<option value="6">四国</option>
 </select>
</td>
 </tr>
 <tr>
 <th>お問い合わせ内容</th>
 <td><textarea name="textarea"  cols="45" rows="5"></textarea></td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>

授業日誌　5/19

Ｆｌａｓｈ

  • 元々はスマートスケッチというソフトだった。
  • ビットマップ〜ベクトルに変換できるソフト
  • Ｗｅｂ向きである（データが軽い）

授業ではActionScript2.0を勉強する
　　　　ActionScript3.0は敷居が高い

フレームのコマンドキー

  • F5 -フレームを追加します。
  • Shiftキーを押しながらF5 - [削除]フレーム
  • F6 -キーフレームを追加
  • F7 -空白キーフレームを追加します。
  • F8 -メイクシンボル
  • アニメーションを再生する

play();

  • アニメーションの動きを止める

stop();

  • アニメーションを再開する

on(release){
play();
}


illustrator〜photoshopに書き出すGIFアニメの作成

formの授業　記述 

<DOCTYPE html>
<html lang="ja">
<head>
<mata charset="UTF-8">
<title>お問い合せフォーム 練習</title>
</head>
<body>
<form action="#" method="post" enctype="multipart/form-data">
<p>お問い合わせはこちらのフォームからお願いします。</p>
<p>お名前：
<input type="text" name="name" size="20" maxlength="10" value="お名前	"></p>
<p>内容：
<textarea name="subject" rows="5" cols="40">お問い合わせ内容 </textarea></p>
<!-- チェックボックス  -->
<p>スマートフォン：
<input type="checkbox" name="mobile" value="1" checked> iphone
<input type="checkbox" name="mobile" value= "2" > android
<input type="checkbox" name="mobile" value= "3">その他
</p>
<!-- ラジオボタン -->
<p>性別：
<input type="radio" name="sex" value="male" checked>男性
<input type="radio" name="sex" value="female">女性
</p>
 <!--リスト -->   
<p>言語：
<select name="language">
<option value="ja">日本</option>
<option value="en">英語</option>
<option value="de">ドイツ</option>
<option value="fr">フランス</option>
<option value="ko"> 韓国</option>
<option value="zh">中国</option>
</select>
</p>
<!-- パスワード  -->
<p>パスワード：
<input type="password" name="password" size-"10" maxlength="5"></p>
<p><input  type="submit" value="送信"></p>
<!-- 写真をアップロード -->
<p>
<input type="file" name="picture">
</p>
<p>
<input type="submit" value="送信"><input type="submit" value="リセット">
</p>
</form>
</body>
</html>

まとめ

  • action="データの送信先URLを入れる"
  • method="post" フォームのデータのみを本文として送信
  • mane属性は必須
  • enctype="multipart/form-data"　ファイルを添付する様なフォーム

授業日誌　positionの追記 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>position</title>
<style type="text/css">
<!--
*{
	margin: 0;
	padding: 0;
}
#header {
background-color: aqua;
width:800px;
height:150px;
position:relative;
}
#header-inner  {
position: absolute;
 top: 120px;
right: 40px;
}
#header-inner  li {
fonto-size: 0.85em;
display: inline;
padding: 0 1me  0  0;
}
ul {
list-style-type: none;
}
#footer {
 background-color: lightgray;
 color: white;
 width: 800px;
 height: 50px;
 text-align: center; 
 padding: 20px 0 0 0;
} 
-->
</style>
</head>
<body>
<div id="container">
   	 <div 	id="header">
    		 <div  id="header-inner">
<ul>
  <li><a href="#">このサイトについて</a></li>
  <li><a href="#">お問い合わせ</a></li>
  <li><a href="#">サイトマップ</a></li>
</ul>
					</div>
			</div>
	<div id="footer">
<address>ここに連絡先のテキストが入る</address>
	</div>
</div>
</body>
</html>