Microsoft PowerPoint - A07回目②.pptx

Save this PDF as:
 WORD  PNG  TXT  JPG

Size: px
Start display at page:

Download "Microsoft PowerPoint - A07回目②.pptx"

Transcription

1 1 コンピュータリテラシーII ( 樋 口 担 当 ) 7 回 目 2 11/14

2 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I. JavaScript( 画 像 関 係 ) II. 課 題

3 3 I.JavaScript

4 1.JavaScriptを 使 用 するためのお 約 束 4 <HEAD></HEAD>の 間 に <META http-equiv= Content-Script-Type content= text/javascript > を 記 入 する <HTML> <HEAD> <TITLE>JavaScriptを 使 用 するためのお 約 束 </TITLE> <META http-equiv="content-script-type" content="text/javascript"> </HEAD> <BODY> ここに 本 文 を 書 く </BODY> </HTML>

5 2.スライドショー( 準 備 ) 5 (1) 画 像 を 用 意 する watanabe.jpg hoshino.jpg miyake.jpg yoshizawa.jpg (2)サーバー 内 に 画 像 を 置 くフォルダを 作 成 する (3) 画 像 をサーバー 内 の 画 像 フォルダに 置 く

6 2.スライドショー1( 画 像 の 表 示 ) 6 <HTML> <HEAD> <TITLE>まずは 画 像 の 表 示 </TITLE> </HEAD> <BODY> 画 像 のサイズ ( 横 145ピクセル, 縦 155ピクセル) <IMG id= photo" src="photo/watanabe.jpg" width=145 height=155> </BODY> </HTML> 画 像 を 表 示 する 場 所 のID 名 この 場 合 は photo というID 名 表 示 する 画 像 のファイル 名 この 場 合 は Photoフォルダの 中 の Watanabe.jpg

7 2.スライドショー 2( 文 字 の 表 示 ) 7 <HTML> <HEAD> <TITLE> 操 作 する 文 字 も 表 示 </TITLE> </HEAD> <BODY> 文 字 をクリックできるように 汎 用 的 なインラインレベル 要 素 SPANとする タグ<SPAN></SPAN> で 表 示 する 文 字 を 挟 む <SPAN style="cursor:hand"> 前 へ</SPAN> <SPAN style="cursor:hand"> 後 へ</SPAN><BR> <IMG id= photo" src="photo/watanabe.jpg" width=145 height=155> </BODY> </HTML> 表 示 する 文 字 文 字 の 上 にカーソルが 来 たら カーソルの 形 を 手 の 形 にする

8 2.スライドショー 3( 変 数 の 作 成 1) 8 <HTML> <HEAD> ( 無 くてもOK) <TITLE> 関 数 の 作 成 </TITLE> <META http-equiv="content-script-type" content="text/javascript"> <SCRIPT type ="text/javascript"> <!-- var p_no = 0; //--> </SCRIPT> </HEAD> <BODY> HTMLとしてはコメント 扱 い JavaScriptの 終 了 タグ JavaScriptを 使 用 するためのお 約 束 ( 関 数 のみ 使 用 する 場 合 には 無 くてもOK) ここからJavaScriptを 書 くという 開 始 タグ 変 数 の 定 義 と 初 期 化 var 変 数 を 定 義 するという 意 味 (お 約 束 ) 変 数 p_no を 定 義 ( 使 用 することの 宣 言 ) p_no を 0 で 初 期 化 ( 最 初 の 値 ) <SPAN style="cursor:hand"> 前 へ</SPAN> <SPAN style="cursor:hand"> 後 へ</SPAN><BR> <IMG id= photo" src="photo/watanabe.jpg" width=145 height=155> </BODY> </HTML>

9 2.スライドショー 4( 変 数 の 作 成 2) 9 <HTML> <HEAD> <TITLE> 関 数 の 作 成 </TITLE> <META http-equiv="content-script-type" content="text/javascript"> <SCRIPT type ="text/javascript"> <!-- 変 数 im を 定 義 ( 使 用 すると 宣 言 ) var p_no = 0; var im = new Array("watanabe.jpg","hoshino.jpg","miyake.jpg","yoshizawa.jpg"); //--> </SCRIPT> 新 しく 配 列 (array)を 作 る 配 列 の 中 身 </HEAD> 変 数 im を 新 しく 作 った 配 列 で 初 期 化 配 列 im の 中 身 im[0] = "watanabe.jpg " im[1] = "hoshino.jpg " im[2] = "miyake.jpg" im[3] =,"yoshizawa.jpg"

10 2.スライドショー 5( 関 数 の 作 成 1) 10 <HTML> <HEAD> <TITLE> 関 数 の 作 成 </TITLE> <META http-equiv="content-script-type" content="text/javascript"> <SCRIPT type ="text/javascript"> <!-- var p_no = 0; var im = new Array("watanabe.jpg","hoshino.jpg","miyake.jpg","yoshizawa.jpg"); //--> </SCRIPT> </HEAD> function setphoto(no){ p_no = no; photo.src = "photo/"+im[p_no]; } ID 名 がphotoの 画 像 のファイルを 変 更 ファイル 名 photo/ + im[p_no] (ex)p_no = 2 の 場 合,im[2]= "miyake.jpg ファイル 名 photo/miyake.jpg 関 数 の 定 義 ( 使 用 することの 宣 言 ) 関 数 名 :setphoto 引 数 :no 変 数 p_no に 引 数 no を 代 入

11 2.スライドショー 6( 関 数 の 作 成 2) 11 <HTML> <HEAD> <TITLE> 関 数 の 作 成 </TITLE> <META http-equiv="content-script-type" content="text/javascript"> <SCRIPT type ="text/javascript"> <!-- var p_no = 0; var im = new Array("watanabe.jpg","hoshino.jpg","miyake.jpg","yoshizawa.jpg"); function setphoto(no){ if( no > 3 ) no = 3; if( no < 0 ) no = 0; p_no = no; photo.src = "photo/"+im[p_no]; } //--> </SCRIPT> </HEAD> p_no は3が 最 大 なので,noが 3より 大 きくならないように 制 限 if(no>3) :もしnoが3より 大 きい 場 合 には no = 3; :noを3にしなさい p_no は0が 最 小 なので,noが 0より 小 さくならないように 制 限

12 2.スライドショー 7( 関 数 の 使 用 ) 12 <BODY> <SPAN style= cursor:hand onclick= setphoto(p_no 1); > 前 へ</SPAN> <SPAN style="cursor:hand"onclick= setphoto(p_no + 1); > 後 へ</SPAN><BR> <IMG id= photo" src="photo/watanabe.jpg" width=145 height=155> </BODY> </HTML> 文 字 をクリックするとsetPhoto() 関 数 を 実 行 その 時 の 引 数 は 現 在 のp_no よりも 1 した 数 値 とする 文 字 をクリックするとsetPhoto() 関 数 を 実 行 その 時 の 引 数 は 現 在 のp_no よりも +1 した 数 値 とする (ex) 1 現 在 p_no が 2の 場 合 :photo/miyake.jpg が 表 示 されている. 2 文 字 前 へ がクリックされる. 3 p_no が 2 から -1 されて 1 となる. 4 関 数 setphoto() が no = 1 として 実 行 される. 5 no は 1 なので,0 よりも 小 さくないし, 3 より 大 きくないので, そのまま p_no に 代 入 される.p_no は 1 となる. 6 no が 2 から -1 されて 1 となる. 7im[p_no] はim[1]となり,その 中 身 はhoshino.jpg である. 8 ID 名 が photo の 画 像 のファイル 名 が photo/hosino.jpg に 変 更 される.

13 2.スライドショー 7( 関 数 の 使 用 ) 13 function setphoto(no){ if( no > 3 ) no = 3; if( no < 0 ) no = 0; p_no = no; photo.src = "photo/"+im[p_no]; } (ex) 1 現 在 p_no が 2の 場 合 :photo/miyake.jpg が 表 示 されている. 2 文 字 前 へ がクリックされる. 3 p_no が 2 から -1 されて 1 となる. 4 関 数 setphoto() が no = 1 として 実 行 される. 5 no は 1 なので,0 よりも 小 さくないし, 3 より 大 きくないので, そのまま p_no に 代 入 される.p_no は 1 となる. 6 no が 2 から -1 されて 1 となる. 7im[p_no] はim[1]となり,その 中 身 はhoshino.jpg である. 8 ID 名 が photo の 画 像 のファイル 名 が photo/hosino.jpg に 変 更 される.

14 3.フォームのプッシュボタンの 使 用 1 14 <BUTTON type= button name= データ 名 > ボタンに 表 示 される 文 字 </BUTTON> <HTML> <HEAD> <TITLE>プッシュボタン</TITLE> </HEAD> <BODY> <FORM action="thank.html" method="post"> ストレス 発 散 にどうぞ <BUTTON type="button" name="punch"> パンチ </BUTTON> </FROM> </BODY> </HTML> CGI 等 に 情 報 を 送 信 するわけで は 無 いので,この 部 分 は 不 要

15 3.フォームのプッシュボタンの 使 用 2 15 <HTML> <HEAD> <TITLE>プッシュボタン</TITLE> </HEAD> <BODY> <FORM > ストレス 発 散 にどうぞ <BUTTON type= button name= punch onclick= 処 理 > パンチ </BUTTON> </FROM> </BODY> </HTML> クリックされた 場 合 に 何 か 処 理 をする 場 合 は ここに 処 理 を 書 く 文 字 の 場 合 と 同 じ <BODY> <SPAN style= cursor:hand onclick= setphoto(p_no 1); > 前 へ</SPAN> <SPAN style="cursor:hand"onclick= setphoto(p_no 1); > 後 へ</SPAN><BR> <IMG id= photo" src="photo/watanabe.jpg" width=145 height=155> </BODY> </HTML>

16 16 II. 課 題

17 1. 課 題 17 自 分 のWebページの 全 世 界 への 公 開 ( 続 き) 1 次 の 要 件 満 たす 自 分 のWebページのデータファイルの 作 成 2データファイルをWebサーバ(sstu.nit.ac.jp)にUP 提 出 方 法 : 自 分 のホームページを 見 れるようにすること 先 週 と 同 じ 要 件 先 週 までに 作 成 したページに スライドショーのページを 追 加 する

18 2. 要 件 の 詳 細 18 要 件 1:メニューにスライドショーのページを 追 加 する.ただし, 内 容 名 称 は 任 意 であり 評 価 に 影 響 しない.(スライドショーという 名 前 には 普 通 はしない) 要 件 2:スライドショーのページもCSSを 用 い,スタイルの 統 一 を 図 る. 要 件 3:( 低 評 価 ) サンプルをベースにして,フォームのボタンを 用 いて 画 像 を 切 替 えられるようにする. ( 高 評 価 ) 画 像 の 下 にサムネイル( 小 さい 画 像 )を 表 示 して,それをクリッ クすると 大 きな 画 像 が 表 示 されるようにする. 要 件 4: 拡 大 縮 小 のボタンを 用 意 して,それをクリックすると 画 像 を 拡 大 縮 小 できるようにする. ( 高 評 価 ) ボタンを 押 した 回 数 で 大 きさが 段 階 的 に 変 化 するようにする.

19 3.ヒント 19 (1)サムネイル 1サムネイル 画 像 は,<img width= 幅 height= 高 さ>タグで サイズ 指 定 した 画 像 を 埋 め 込 む. 2その 画 像 にイベントを 埋 め 込 む. 3 埋 め 込 むイベントは, その 画 像 と 同 じ 画 像 を 表 示 さ せるためのもの (2) 画 像 の 拡 大 縮 小 1 拡 大 縮 小 ボタンを 配 置 する. 2srcではなく width= と height= を 書 き 換 える 関 数 を 別 に 用 意 する.

20 4. 採 点 方 法 20 1スライドショーページへのリンクがある 2スライドショー( 画 像 の 切 替 )ができる 3フォームのボタンで 画 像 の 切 替 ができる あるいは サムネイルをクリックすることで 画 像 の 切 替 ができる 4 画 像 の 拡 大 縮 小 ができる. 5 数 段 階 にわたり 画 像 の 拡 大 縮 小 ができる. 6CSSを 用 い, 全 てのページのスタイルが 統 一 している. 7 先 週 までの 課 題 が 全 てできている. 締 め 切 り 基 本 的 に 演 習 時 間 中 ( 次 回 までに)

Microsoft PowerPoint - 08回目.pptx

Microsoft PowerPoint - 08回目.pptx 1 コンピュータリテラシーII ( 樋 口 担 当 ) 4 回 目 10/17 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I.スタイルシート II.レイアウト III. 課 題 3 I.スタイルシート 1.スタイルシート 4 スタイルシート: 文 書 のスタイルの 設 定 が 書 かれているデータ CSS:スタイルシートの 書 き 方 ( 言 語 )の 一 つ Cascading

More information

CONTENTS 0 1 2 3 4 5 6 7 8 9 10 0 viii ix x http://www.vector.co.jp/vpack/filearea/win/writing/edit/hm/index.html http://hidemaru.xaxon.co.jp/lib/macro/index.html ftp://ftp.m17n.org/pub/mule/windows/ http://www.yatex.org/

More information

アスラテック株式会社 会社案内

アスラテック株式会社 会社案内 JavaScript SDK for V-Sido CONNECT 利 用 の 手 引 き Mac 編 アスラテック 株 式 会 社 目 次 1. はじめに 1-1. 本 マニュアルの 概 要 p.3 1-2. 使 用 する 機 材 など p.4 1-3. 各 機 器 の 接 続 構 成 と 開 発 イメージ p.5 2. 初 期 設 定 とVSidoConn4Macの 導 入 2-1. Bluetoothのペアリング

More information

1 1 1........................ 1 2........................ 1 3 JavaScript..................... 2 4................... 2 2 3 1 Python..................

1 1 1........................ 1 2........................ 1 3 JavaScript..................... 2 4................... 2 2 3 1 Python.................. JavaScript 0648016 1 1 1........................ 1 2........................ 1 3 JavaScript..................... 2 4................... 2 2 3 1 Python.................. 3 2......................... 4 3..........................

More information

「V-Sido CONNECT RC」 Raspberry Pi 2との連係方法

「V-Sido CONNECT RC」 Raspberry Pi 2との連係方法 アスラテック 株 式 会 社 V-Sido CONNECT RC Raspberry Pi 2との 連 係 方 法 目 次 1. はじめに 1-1. 本 マニュアルの 概 要 p.3 1-2. 使 用 する 機 材 など p.4 1-3. 各 機 器 の 接 続 イメージ p.5 1-4. JavaScriptによる 開 発 環 境 の 概 略 p.6 2. Raspberry Pi 2を 利 用

More information

コンピュータサイエンス 4. ウェブプログラミング

コンピュータサイエンス 4. ウェブプログラミング 4. Chris Plaintail 2014 1 / 43 1 HTML CSS 2 JavaScript DOM jquery 3 4 PHP SQL PHP SQL 2 / 43 HTML HTML CSS HTML Ajax (Asynchronous JavaScript + XML) PHP SQL 3 / 43 HTML, CSS http, https CSS HTML CSS.html

More information

Microsoft PowerPoint - 051105-2.ppt

Microsoft PowerPoint - 051105-2.ppt 1.Webアプリケーション 1-1 Web 1989Tim Berners-Lee 1993 1999iWindows98 2005: http://www.w3.org/people/berners-lee/ 1-2 ( ) 汎 用 機 オフコン データベース アプリケーション 言 語 (COBOLなど) 文 字 端 末 タイプライター 端 末 http://research.microsoft.com/~gbell/digital/timeline/dechistory.htm

More information

HTMLとメタデータ

HTMLとメタデータ HTMLとメタデータ http://www2.mmc.atomi.ac.jp/~artnavi1/lib rarysci/index.htmlを 例 にHTMLを 理 解 する IPアドレス ドメイン 名 http://www2.mmc.atomi.ac.jp httpとはhyper Text Transfer Protocol( 何 でもリンクできるテ キストの 通 信 手 順 : 説 明 JPNIC)

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション ホームページの 基 礎 IPアドレス インターネットへの 接 続 に 必 要 なネットワーク 上 のアドレス こ のアドレスは0から255までの4 組 に 数 字 で 表 されます ( 例 192.168.1.1) URL IPアドレスはホームページの 場 所 を 示 す 住 所 です たとえば 220.133.0.1に 接 続 しようとして ブラウザーのURLに 220.133.0.1と 入 れればいいのですが

More information

Microsoft Word - class_specification_guide_v60.doc

Microsoft Word - class_specification_guide_v60.doc IM-FormatCreator クラス 指 定 手 順 書 Ver 6.0 IM-FormatCreator i 1 はじめに 1 1.1 目 的 1 2 プログラムの 作 成 2 2.1 ファンクション コンテナ(.JS)の 作 成 2 2.2 プレゼンテーションページ(.HTML)の 作 成 3 3 クラス 指 定 項 目 の 設 定 5 3.1 クラス 指 定 設 定 画 面 5 3.2 クラスパス

More information

■新聞記事

■新聞記事 情 報 処 理 C (P.1) 情 報 処 理 C (2016 年 度 ) ホームページ 作 成 入 門 テキストエディタ(メモ 帳 TeraPad など)でHTMLファイルを 作 成 する HTML(Hyper Text Markup Language ) ホームページを 記 述 するための 言 語 のこと テキストエディタの 起 動 (TeraPad の 場 合 ) [スタート]-[プログラム]-[テキストエディタ]-[TeraPad]

More information

(Microsoft Word - \203X\203\215\203b\203g\203}\203V\203\223.doc)

(Microsoft Word - \203X\203\215\203b\203g\203}\203V\203\223.doc) JavaScript (スロットマシン) ここでは JavaScript を 使 ってスロットマシンを 作 ります スロットマシンを 作 る と 言 っても そう 難 しいものではありません 3 枚 のボードの 数 字 を0から9まで 順 番 に 表 示 して ボタンをクリックすると それぞ れの 札 の 動 きが 止 まり その 結 果 によってメッセージが 異 なる このようなものを 作 りましょう

More information

タグの 内 側 で 関 数 を 定 義 してタグ 側 で 実 行 することもできます JavaScript サンプル function write(str) { document.write(str); } write('hello World!'); 上 例 のように

タグの 内 側 で 関 数 を 定 義 してタグ 側 で 実 行 することもできます <TITLE>JavaScript サンプル</TITLE> function write(str) { document.write(str); } write('hello World!'); 上 例 のように 情 報 メディアとインターネット 授 業 資 料 (2011.7.4) 1.HTML の 基 本 HTML ファイルというのは 例 えば 以 下 のような 内 容 のテキストファイルです 拡 張 子 を.html また は.htm とするのが 普 通 で Web ブラウザで 読 み 込 まれて 中 身 の 表 示 が 行 われます Simple HTML File Hello

More information

MovableType 更新作業マニュアル

MovableType 更新作業マニュアル ソフィアンの 広 場 ブログサイト 作 成 更 新 マニュアル 2011 年 10 月 20 日 上 智 大 学 ソフィア 会 COPYRIGHT 2011 Sophia Alumni Association. ALL RIGHTS RESERVED. 1/12 目 次 1 概 要 3 2 機 能 説 明 4 2.1 新 規 ブログ 記 事 の 作 成 4 2.1.1 新 規 作 成 - ブログ 記

More information

スライド 1

スライド 1 第 7 講 観 光 情 報 論 2008 年 6 月 4 日 Style Sheet (CSS) 宮 国 薫 子 1 スタイルシート (CSS) CSSとは(Cascading Style Sheets) 本 来 ホームページにデザインを 加 える 機 能 の すべて 教 科 書 で 言 う スタイルシート とはCSSのことを 指 す CSSを 使 うと Page 106 にあるようにホーム ページの

More information

4 Java へようこそ の 画 面 が 表 示 されるので インストール をクリックします 5 Java セットアップ 進 行 中 画 面 が 表 示 されます 6 Java セットアップ 完 了 画 面 が 表 示 されるので 閉 じる をクリックします インストール が 完 了 しました 7

4 Java へようこそ の 画 面 が 表 示 されるので インストール をクリックします 5 Java セットアップ 進 行 中 画 面 が 表 示 されます 6 Java セットアップ 完 了 画 面 が 表 示 されるので 閉 じる をクリックします インストール が 完 了 しました 7 NPO 法 人 いきいきネットとくしま 第 95 回 定 例 勉 強 会 森 の 日 2012 年 5 月 23 日 担 当 : 今 柴 有 美 子 折 り 紙 飛 行 機 を 飛 ばして 遊 ぼう 折 り 紙 飛 行 機 を 飛 ばして 写 真 の 動 画 を 楽 しむためには Java という 無 料 のフリーソフ トが 必 要 です Java とは 1 ネットワークを 通 じて Web プラウザにダウンロードされ

More information

html_text

html_text HTML の 基 礎 2015.12.15 1. HTML ファイルの 構 成 1.1. HTML とは? Web ブラウザでホームページを 表 示 するためには,HTML(Hyper Text Markup Language)と 呼 ぶ 言 語 で 記 述 す る 必 要 が あ り ま す.HTML 形 式 のファイルは < と > で 囲 んだ 予 約 語 (タグ)を 含 むテキストファイルで,Web

More information

データベースS 演習資料

データベースS 演習資料 2015/6/24 データベースS 演 習 資 料 第 3 回 PHP による Web インターフェース(2) 九 州 工 業 大 学 情 報 工 学 部 システム 創 成 情 報 工 学 科 講 義 担 当 : 尾 下 真 樹 1. フォームを 使 った 入 力 インターフェースの 開 発 前 回 の 演 習 に 引 き 続 き データベースをウェブから 利 用 するためのインターフェースの 開

More information

1/2

1/2 札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト (2) 1 札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト HTMLの 基 礎 知 識 (2) 1 画 像 の 表 示 HPに 画 像 を 表 示 させてみる まず HTML 文 書 と 同 じフォルダ 内 にJPEGファイル( 拡 張 子.jpg )を1 個 準 備 する ( 画

More information

4 chop($line); 5 $line =~ s/ r$//; 6 unshift(@output,$line); 7 } 8 print join(" n",@output); 1 行 目 は Perl インタープリターがあるディレクトリを 明 示 する インタープリターとは 書 かれたプロ

4 chop($line); 5 $line =~ s/ r$//; 6 unshift(@output,$line); 7 } 8 print join( n,@output); 1 行 目 は Perl インタープリターがあるディレクトリを 明 示 する インタープリターとは 書 かれたプロ 2014.6.17 医 療 者 のための 情 報 技 術 入 門 第 8 回 プログラムがはたらくしくみを 学 ぶ(1) 日 紫 喜 光 良 概 要 1.はじめに- 具 体 例 から- -------------ここまで-------------- 2. 足 りないものは 借 りてくる-Javascript のライブラリ 3. 仕 事 は 人 にやらせる-サーバーとブラウザの 役 割 分 担 1.はじめに-

More information

目 次 1. 概 要 2.サーバーへの 設 置 3. 設 定 4.ユーザーアクセス 記 録 の 収 集 5. 制 限 解 除 キー 6. 利 用 規 定 7. 更 新 履 歴

目 次 1. 概 要 2.サーバーへの 設 置 3. 設 定 4.ユーザーアクセス 記 録 の 収 集 5. 制 限 解 除 キー 6. 利 用 規 定 7. 更 新 履 歴 BASIC 認 証 管 理 L-TOOL BasicAuth (ver 2.2) 取 扱 説 明 書 Little Net http://l-tool.net/ - 2015 年 7 月 22 日 版 - 目 次 1. 概 要 2.サーバーへの 設 置 3. 設 定 4.ユーザーアクセス 記 録 の 収 集 5. 制 限 解 除 キー 6. 利 用 規 定 7. 更 新 履 歴 1. 概 要 この

More information

What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私 ) ぜひ 名 前 を 覚 えていってくださ

What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私 ) ぜひ 名 前 を 覚 えていってくださ HeartRails APIs for MA5 ハートレイルズの 提 供 API について http://www.heartrails.com/ What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私

More information

方程式を解いてみよう! C++ から PHP + JavaScriptへ

方程式を解いてみよう! C++ から PHP + JavaScriptへ 方 程 式 を 解 いてみよう! C++ から PHP + HTML + JavaScriptへ 静 岡 理 工 科 大 学 総 合 情 報 学 部 コンピュータシステム 学 科 幸 谷 智 紀 (こうや とものり) http://na-inet.jp/ 今 日 のメニュー 1. コンピュータ 環 境 と 本 日 のゴールの 確 認 2. PHPプログラムを 実 行 してみる 3. HTMLで 自

More information

m_sotsuron

m_sotsuron iphone Web 0848066 1. 1 1 1 2 iphone 2 3 2 4 3 2. 3 1 3 2 iphone Web 6 3 HTML 10 4 CSS 12 5 iphone 14 6 15 7 16 8 ipad 18 3. 22 iphone Web Web 2 iphone Web iphone iphone Web iphone Web PC 1 2000 iphone

More information

kagoemon-a

kagoemon-a かごえもんの 初 期 設 定 は 全 ての 設 定 で 行 います 基 本 設 定 ショッピングカートシステム ( 注 文 フォーム ) に 関 する 基 本 設 定 を 行 います 基 本 設 定 の 管 理 画 面 用 パスワード とは? 商 品 注 文 における 送 料 および 注 文 完 了 時 に 自 動 送 信 されるショップの 専 用 メールアドレス メール 文 に 記 載 する 挨

More information

目 次 0. 計 測 タグ 設 置 の 基 本 3 このマニュアルについて... 4 計 測 タグ 設 置 の 流 れ... 5 必 ず 確 認 していただきたいこと... 6 1. 計 測 タグの 種 類 7 入 口 ページタグ... 9 コンバージョンタグ... 10 イベント 計 測 用 タグ

目 次 0. 計 測 タグ 設 置 の 基 本 3 このマニュアルについて... 4 計 測 タグ 設 置 の 流 れ... 5 必 ず 確 認 していただきたいこと... 6 1. 計 測 タグの 種 類 7 入 口 ページタグ... 9 コンバージョンタグ... 10 イベント 計 測 用 タグ 計 測 タグの 設 置 と 動 作 確 認 方 法 このマニュアルの 対 象 となる 方 ウェブアンテナの 計 測 タグをサイトに 設 置 するご 担 当 の 方 (HTML に 関 する 知 識 をある 程 度 お 持 ちの 方 を 想 定 ) このマニュアルでわかること 計 測 タグの 設 置 方 法 や 注 意 点 コンバージョン 属 性 を 計 測 するための 実 装 例 計 測 タグの 動

More information

第9回

第9回 第 9 回 2016 年 7 月 16 日 情 報 教 育 演 習 II 第 9 回 (1) CSS(4) (1) 今 回 の 課 題 (2) リストの 記 号 や 番 号 の 設 定 (2) クラスの 利 用 (2) クラスとは (2) クラスを 使 った 設 定 (3) CSSファイルでの 設 定 (3) HTMLファイルでの 利 用 (3) クラスの 利 用 例 (1) (3) クラスの 利

More information

サーバサイドスクリプトPHPを実感しよう

サーバサイドスクリプトPHPを実感しよう 第 3 講 サーバサイドスクリプト PHP を 実 感 しよう! クライアントサイドでは HTML に 埋 め 込 んだ(あるいは 別 ファイルから HTML に 読 み 込 まれた)JavaScript によって さまざまな 処 理 や 動 的 ページの 生 成 を 行 えることは すで に 第 3 講 までで 学 習 しました しかし HTML と JavaScript の 組 合 せではどうしても

More information

スライド 1

スライド 1 Webプログラミング2 2.Webプログラミング 概 要 (2) ( 復 習 )Webとは 様 々な 利 用 シーン 様 々なデバイス/ブラウザ パソコン 携 帯 電 話 ゲーム 機 /TV 電 子 ブックリーダー 学 校 案 内 / 会 社 案 内 オンラインショップ ブログ/ 掲 示 板 /SNS/Twitter/Facebook 学 内 / 社 内 システム スケジューラ/カレンダー/Webメール

More information

おすすめページ

おすすめページ 4-5 第 4 章 高 度 なリストのデザイン スマートフォン 向 けのCSSを 読 み 込 む スマートフォンのように 画 面 サイズの 小 さい 端 末 で 見 たときは 専 用 のCSSを 読 み 込 むように します 画 面 サイズが 小 さいときはレイアウトを 変 更 する スマートフォンなど パソコンに 比 べて 画 面 の 小 さい 端 末 で Web サイトを 閲 覧 しようとすると

More information

CSSの基礎

CSSの基礎 Webページの 見 た 目 を 定 義 する 視 覚 のための 言 語 CSS ファイル 視 覚 表 現 関 連 付 ける HTML ファイル 論 理 構 造 CSSの 基 礎 CSSの 記 述 方 法 基 本 的 な 形 セレクタ{ プロパティ1: 値 ; プロパティ2: 値 ; セレクタの 種 類 タイプセレクタ CSSの 記 述 HTML CSSを 適 用 する 箇 所 CSSを 記 述 する

More information

InfoPros13_digest.key

InfoPros13_digest.key ! CSS sample2.css h1 h1 { color : blue ; } : ; { } : 14 : : p { font-size: 14pt; } p { font-style: italic; } p { text-decoration: underline; } p { font-size:

More information

~モバイルを知る~ 日常生活とモバイルコンピューティング

~モバイルを知る~ 日常生活とモバイルコンピューティング Webプログラミングの 基 礎 PHPの 基 礎 (8) (2011/07/06) 政 策 情 報 学 部 渡 辺 恭 人 riho-m@cuc.ac.jp メーリングリスト:riho-m-rg11@cuc.ac.jp: 資 料 ページ: http://www.cuc.ac.jp/~riho-m/rg11/ 前 回 の 課 題 POSTでデータが 送 信 されているかを 確 認 送 信 されていれば

More information

Microsoft PowerPoint - InfPro_I9.pptx

Microsoft PowerPoint - InfPro_I9.pptx 今 日 の 学 習 内 容 エディタ(emacs)を 使 った 基 本 的 なHTML の 書 き 方 Webページの 公 開 HTMLの 基 礎 知 識 HTML(Hyper Text Markup Language)は Webページを 作 るための 必 要 な 記 述 言 語 HTMLにおける 指 定 の 内 容 は: 1. 文 章 (テキスト)に 対 する 役 割 2. 文 章 やイメージなどのページ

More information

A

A A. ツールボタン の 使 い 方 下 の 図 は NetCommons の 共 通 エディタで 表 示 されるツールボタンの 一 覧 です 書 式 設 定 左 からフォント サイズ スタイルを 設 定 するためのプルダウンメニューです 効 果 をつけたい 箇 所 の 先 頭 でク リックするか 効 果 をつけたい 箇 所 をカーソルで 選 択 してボタンをクリックします 文 字 効 果 左 から

More information

■コンテンツ

■コンテンツ Joruri CMS 2.0.0 基 本 マニュアル (2013.7.23) 2012.2.14 データ データでは 複 数 の 場 所 で 共 通 して 利 用 できる 情 報 (テキスト 形 式 ファイル 形 式 )を 作 成 登 録 管 理 できます テキスト データ>テキスト 作 成 されたテキストが 一 覧 表 示 されます 複 数 の 場 所 で 利 用 するテキスト( 住 所 TEL

More information

(1) ,,,,, <> ( ) (/ ) (2) HTML5 (3) HTML (4) html (ja) (5) JavaScript CSS (6)

(1) <html>,,,,, <> ( ) (/ ) (2) <!DOCTYPE html> HTML5 (3) <html> HTML (4) <html lang= ja > html (ja) (5) JavaScript CSS (6) <meta charset= shift jis > HTML HTML HyperText Markup Language (Markup Language) (< > ) 1 sample0.html ( ) html sample0.html // JavaScript

More information

スライド 1

スライド 1 HTML5 と 関 連 API はじめに 一 般 的 に HTML5 と 呼 ばれている 範 囲 ( 広 義 ) HTML5 という 仕 様 Web Workers キャンバス ドラッグ&ドロップ Data Cache API オフライン コミュニケーション File API など Server-Sent API Web SQL Database Web Sockets Web Storage Indexed

More information

ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2

ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 レンタルショッピングカートマニュアル Vol.2 ~ デザイン 設 定 編 ~ ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 ファイル 管 理 ファイルのアップロード/ダウンロード デザイン 設 定 >>

More information

コンピュータサイエンス 1. ウェブの基本

コンピュータサイエンス 1. ウェブの基本 1. Chris Plaintail May 18, 2016 1 / 27 1 2 HTML HTML 3 CSS style 2 / 27 HTML HTML HTML HTML CSS HTML CSS 3 / 27 4 / 27 HTML HTML, CSS HTML, CSS http, https file CSS HTML CSS.html PC file:// PC.html 5 /

More information

1.ユーザーズマニュアル 目 次 1. ユーザーズマニューアル 目 次 2. 管 理 画 面 基 本 情 報 3_1. 施 設 情 報 管 理 メニュー / 情 報 修 正 について パート1 施 設 の 選 択 3_2. 施 設 情 報 管 理 メニュー / 情 報 修 正 について パート2 基

1.ユーザーズマニュアル 目 次 1. ユーザーズマニューアル 目 次 2. 管 理 画 面 基 本 情 報 3_1. 施 設 情 報 管 理 メニュー / 情 報 修 正 について パート1 施 設 の 選 択 3_2. 施 設 情 報 管 理 メニュー / 情 報 修 正 について パート2 基 ハイツ&いこいの 村 様 施 設 情 報 最 新 情 報 お 勧 めプラン 更 新 システム ユーザーズマニュアル [ 連 絡 先 ] 北 川 宣 浩 TEL:03-5434-8282 Nobuhiro_Kitagawa@jic.co.jp 竹 内 勇 人 TEL:03-3702-7673 hayato@bamboo-h.com 1.ユーザーズマニュアル 目 次 1. ユーザーズマニューアル 目 次

More information

第5回

第5回 情 報 教 育 演 習 II 第 5 回 HTML(4) 前 回 に 引 き 続 き Webの 中 心 的 な 技 術 HTML について 実 習 をします 今 回 で HTMLのまとめ になります HTML(4) 1. 水 平 線 をつくる( 復 習 ) 2.イメージを 貼 り 付 ける 今 回 の 課 題 1.HTMLファイルを 作 成 する 2.HTMLファイルの 文 法 をチェックする -

More information

JavaScriptプログラミング入門

JavaScriptプログラミング入門 JavaScript 2015 8 15 1 2 1.1 JavaScript.................................. 2 1.2..................................... 3 1.3 if................................... 4 2 6 2.1.....................

More information

<5461726F2D89C692EB834E8389837582CC837A815B83808379815B83578DEC>

<5461726F2D89C692EB834E8389837582CC837A815B83808379815B83578DEC> 初 めて 作 る 家 庭 クラブのホームページ ホームページビルダーの 起 動 WindowsXP, IBM ホームページ ビルダー 10 対 応 1 [スタート]ボタンをクリックして,[すべてのプログラム]-[ IBM ホームページ ビルダー 10 ]-[ホームペ ージ ビルダー]を 選 択 します 2 [スタンダード]を 選 択 して,[ OK ]ボタンをクリックします 1ページ 目 ( index

More information

第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C

第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C 1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 HTML5 では タグの 省 略 は 一 切 認 められていない 第 2 問 インターネット 上 のすべてのコンピュータは イーサネットで 繋 がっている 第 3 問 新 規 にウェブサイトを 公 開 する 際 は HTML ドキュメントをアップロードした 後 に

More information

平成21年1月21日 1

平成21年1月21日 1 eコミマップ 表 画 面 操 作 マニュアル Ver. 2.4.1 2015/06/30 国 立 研 究 開 発 法 人 防 災 科 学 技 術 研 究 所 目 次 1 はじめに... 3 2 システムの 説 明... 3 3 操 作 マニュアル... 4 3.1 E コミマップ 一 覧 画 面... 4 1 ログイン 画 面... 4 2 項 目 一 覧 タブ... 5 3 項 目 一 覧 タブ(ログインしていない

More information

OpenCity2説明

OpenCity2説明 和 光 市 市 民 活 動 支 援 サイト 新 掲 示 板 (FCKエディタ)について 通 常 ホームページを 作 成 するには HTML という 専 門 言 語 の 知 識 が 必 要 ですが FCK エディ タを 使 えば ワードやエクセルと 同 じ 感 覚 で タイトル 文 字 を 太 字 にしたり 表 を 作 成 したり 画 像 を 挿 入 したり 更 にはワードで 作 成 した 文 章 スタイルそのままにコピー&ペースト

More information

<4D6963726F736F667420576F7264202D20819C486F70658F6F93588ED297708AC7979D89E696CA837D836A83858341838B8169342E33566572816A2E646F63>

<4D6963726F736F667420576F7264202D20819C486F70658F6F93588ED297708AC7979D89E696CA837D836A83858341838B8169342E33566572816A2E646F63> 商 品 管 理 商 品 管 理 を 行 うためのメニューです 4.1 商 品 管 理 のサイドメニュー 商 品 管 理 には 以 下 のサイドメニューがあります 商 品 一 覧 登 録 済 みの 商 品 の 一 覧 を 表 示 します 既 に 登 録 済 みの 商 品 の 検 索 検 索 した 商 品 を 編 集 する 際 に 使 用 します 新 規 作 成 商 品 を 新 規 登 録 する 画 面

More information

目 次 1. はじめに... 2 2. Cform をサーバーにアップロードする... 3 3. カレンダー 予 約 システムを 表 示 する... 6 直 接 表 示 の 場 合... 6 Javascript での 埋 め 込 み 表 示... 7 Iframe での 埋 め 込 み 表 示..

目 次 1. はじめに... 2 2. Cform をサーバーにアップロードする... 3 3. カレンダー 予 約 システムを 表 示 する... 6 直 接 表 示 の 場 合... 6 Javascript での 埋 め 込 み 表 示... 7 Iframe での 埋 め 込 み 表 示.. Cform カレンダー 予 約 システム 機 能 解 説 マニュアル 目 次 1. はじめに... 2 2. Cform をサーバーにアップロードする... 3 3. カレンダー 予 約 システムを 表 示 する... 6 直 接 表 示 の 場 合... 6 Javascript での 埋 め 込 み 表 示... 7 Iframe での 埋 め 込 み 表 示... 9 4. 予 約 申 込 管

More information

ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でカートにアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2

ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でカートにアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 レンタルショッピングカートマニュアル ~ デザイン 設 定 編 ~ ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でカートにアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 ファイル 管 理 ファイルのアップロード/ダウンロード デザイン 設 定 >> ファイル

More information

ホームページの作り方 講習会テキスト

ホームページの作り方 講習会テキスト ホームページの 作 り 方 2008 年 5 月 更 新 明 治 大 学 講 習 の 前 に この 講 習 は ホームページ ビルダー10 を 利 用 してホームページを 作 成 し 駿 河 台 地 区 設 置 の WWW サー バーで 公 開 する 手 順 を 実 習 する 講 習 です( 注 1 最 新 のバージョンと 異 なる 場 合 もあります) 講 習 では2つ ページを 作 成 します

More information

クリック クリック リンクを 張 るためのタグ タグ ~ リンク 先 のURLやファイル 名 に 対 してリンクを 張 る 同 じフォルダ 内 のファイルにリンク フォルダ 内 のファイルに

クリック クリック リンクを 張 るためのタグ タグ <a href= リンク 先 のURL ファイル 名 > ~ </a> リンク 先 のURLやファイル 名 に 対 してリンクを 張 る 同 じフォルダ 内 のファイルにリンク <a href= hoge.html > フォルダ 内 のファイルに Webプログラミング プログラミング1 HTML+CSS (5) (2 章 ) 2013/5/22( 水 ) 演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください 演 習 名 使 用 するフォルダ 演 習 1 Z: Webプログラミング1 20130522

More information

担 当 分 のメニュー 6/21, 6/28: アルゴリズムについて 7/5: 出 張 につき 休 講 7/12, 7/19: プログラミングについて ( 補 講 の 予 定 内 容 は 未 定 です) 講 義 情 報 http://www.fos.kuis.kyotou.ac.jp/~igaras

担 当 分 のメニュー 6/21, 6/28: アルゴリズムについて 7/5: 出 張 につき 休 講 7/12, 7/19: プログラミングについて ( 補 講 の 予 定 内 容 は 未 定 です) 講 義 情 報 http://www.fos.kuis.kyotou.ac.jp/~igaras 全 学 共 通 科 目 工 学 部 専 門 科 目 計 算 機 科 学 概 論 アルゴリズムとプログラミング その3 五 十 嵐 淳 igarashi@kuis.kyoto-u.ac.jp 大 学 院 情 報 学 研 究 科 通 信 情 報 システム 専 攻 担 当 分 のメニュー 6/21, 6/28: アルゴリズムについて 7/5: 出 張 につき 休 講 7/12, 7/19: プログラミングについて

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 操 作 マニュアル( 事 業 者 編 ) 平 成 23 年 1 月 1 SHIFTで 作 成 されるホームページ: 構 成 SHIFT 作 成 メニュー HP 完 成 イメージ 登 録 画 面 への 入 り 方 (コミュニティ 利 用 の 場 合 ) 商 工 会 HP(イメージ) ログイン 画 面 1. 都 道 府 県 ID パスワードを 入 力 して OK をクリックします コミュニティTOP 画

More information

Microsoft Word - So-Cool_CART_Pamphlet.doc

Microsoft Word - So-Cool_CART_Pamphlet.doc So-Cool CART COPYRIGHT 2008 Japan Area Code TV Co.,Ltd. ALL RIGHTS RESERVED. も く So-Cool CART と? 3 商 品 ページを 自 由 設 計 可 4 豊 富 な 商 品 ページ 埋 込 み タグ 5 複 数 店 舗 運 営 が 可 7 安 心 簡 単 なクレジットカード 決 済 8 流 行 電 子 マネーEdy

More information

Microsoft PowerPoint - manualtachiyomi.pptx

Microsoft PowerPoint - manualtachiyomi.pptx ニックネームはここに 載 る!! マイページの 左 上 ブログのプロフィール 欄 メッセージを 送 った 相 の 受 信 箱 クリックしてもらえるような 興 味 を 引 く 名 前 にしましょう 記 事 を 編 集 削 除 する 下 書 き 保 存 されている= 公 開 されていない 公 開 されている リンクが 付 いていて クリックすると 公 開 されている 記 事 が 開 く 記 事 を 編

More information

練 習 問 題 1. dataフォルダのq1フォルダ 内 のindex.htmlでブラウザで 正 しく 表 示 できない 状 態 にあ る 画 像 を 正 常 に 表 示 できるようにソースを 修 正 しなさい 修 正 したindex.htmlファイルなどは デスクトップのwdフォルダ 内 にt1と

練 習 問 題 1. dataフォルダのq1フォルダ 内 のindex.htmlでブラウザで 正 しく 表 示 できない 状 態 にあ る 画 像 を 正 常 に 表 示 できるようにソースを 修 正 しなさい 修 正 したindex.htmlファイルなどは デスクトップのwdフォルダ 内 にt1と ウェブデザイン 技 能 検 定 3 級 実 技 練 習 問 題 本 練 習 問 題 の 著 作 権 は 当 協 会 に 帰 属 します 協 会 の 提 供 する 一 部 又 は 全 ての 練 習 問 題 を 無 断 で 複 写 転 載 営 利 利 用 することを 禁 止 します 内 容 解 答 その 他 一 切 のお 問 い 合 わせは 受 け 付 けておりません 本 練 習 問 題 と 実 際 の

More information

おすすめページ

おすすめページ 第 6 章 フォーム コントロールを 作 成 する 作 成 した 内 に お 名 前 や ご 意 見 ご 要 望 などの 入 力 フォームを 作 成 していきま す 最 後 に 送 信 ボタンを 設 置 します テキストフィールドを 作 成 する 名 前 を 入 力 できる 欄 をテキストフィールドで 作 成 します テキストフィールドを 作 成 すると 同 時 にラベ ルのテキストも

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 操 作 マニュアル( 事 業 者 編 ) 平 成 24 年 10 月 SHIFTで 作 成 されるホームページ: 構 成 SHIFT 作 成 メニュー HPイメージ お 問 合 わせ フォーム BtoBページ 掲 示 板 メインページ 商 品 ページ 電 子 決 算 公 告 ページ 1 登 録 画 面 への 入 り 方 (コミュニティ 利 用 の 場 合 ) 商 工 会 HP(イメージ) ログイン

More information

Microsoft PowerPoint - webapp.ppt [互換モード]

Microsoft PowerPoint - webapp.ppt [互換モード] 一 般 的 なWebアクセス Webサーバ バ レスポンス HTML ファイル HTTPリクエスト 画 像 ファイル Webブラウザ あらかじめ 用 意 されたリソースしか 提 供 できない Webアプリケーション Webサーバ バ レスポンス HTTPリクエスト HTML Webブラウザ ページを 動 的 に 生 成 プログラム 実 行 データベース 操 作 Webアプリケーション 掲 示 板 検

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 操 作 マニュアル( 事 業 者 編 ) 平 成 22 年 7 月 1 SHIFTで 作 成 されるホームページ: 構 成 HP 完 成 イメージ SHIFT 作 成 メニュー 登 録 画 面 への 入 り 方 (コミュニティ 利 用 の 場 合 ) 商 工 会 HP(イメージ) ログイン 画 面 1. 都 道 府 県 ID パスワードを 入 力 して OK をクリッ クします コミュニティTOP

More information

目 次 準 備 事 項 ( 前 日 までに 行 っていただきたいこと) 4 まずは 地 図 を 表 示 してみよう 6 Google Mapsの 機 能 の 再 確 認 8 自 分 のサイトに 地 図 を 埋 め 込 む 10 中 心 地 点 にマーカーを 表 示 する 12 近 隣 の 施 設 に

目 次 準 備 事 項 ( 前 日 までに 行 っていただきたいこと) 4 まずは 地 図 を 表 示 してみよう 6 Google Mapsの 機 能 の 再 確 認 8 自 分 のサイトに 地 図 を 埋 め 込 む 10 中 心 地 点 にマーカーを 表 示 する 12 近 隣 の 施 設 に 第 3クールSeason3 WebサービスAPI 勉 強 会 Google Maps API v3の 利 用 目 次 準 備 事 項 ( 前 日 までに 行 っていただきたいこと) 4 まずは 地 図 を 表 示 してみよう 6 Google Mapsの 機 能 の 再 確 認 8 自 分 のサイトに 地 図 を 埋 め 込 む 10 中 心 地 点 にマーカーを 表 示 する 12 近 隣 の 施

More information

HTML文章作成

HTML文章作成 HTML 文 章 作 成 Web ページは HTML(Hyper Text Markup Language) という 言 語 を 使 っ て 欠 かれた HTML ファイルでできています ここでは 簡 単 な HTML 文 章 を 実 際 につくっていきます 参 考 文 献 :エクスナレッジ HTML とスタイルシートによる Web サイト 作 成 術 1. 簡 単 なホームページをつくりましょう

More information

slide.key

slide.key Responsive Web Design Adaptive Web Design マルチ 環 境 対 応 の 考 え 方 考 え 方は? 違 いは? Responsive Web Design.content {! position: absolute;! }! @media screen and (min-width: 768px) {!.content {! position: relative;!

More information

目 次 1. Web メールのご 利 用 について... 2 2. Web メール 画 面 のフロー 図... 3 3. Web メールへのアクセス... 4 4. ログイン 画 面... 5 5. ログイン 後 (メール 一 覧 画 面 )... 6 6. 画 面 共 通 項 目... 7 7.

目 次 1. Web メールのご 利 用 について... 2 2. Web メール 画 面 のフロー 図... 3 3. Web メールへのアクセス... 4 4. ログイン 画 面... 5 5. ログイン 後 (メール 一 覧 画 面 )... 6 6. 画 面 共 通 項 目... 7 7. Web メール 操 作 説 明 書 京 都 与 謝 野 町 有 線 テレビ 0 目 次 1. Web メールのご 利 用 について... 2 2. Web メール 画 面 のフロー 図... 3 3. Web メールへのアクセス... 4 4. ログイン 画 面... 5 5. ログイン 後 (メール 一 覧 画 面 )... 6 6. 画 面 共 通 項 目... 7 7. メール 一 覧 画 面...

More information

2. 画 面 の 分 割 タグを 使 用 することにより 1 つの 画 面 を 縦 横 複 数 に 分 割 することがでる 分 割 されたそれぞれ の 画 面 をフレームと 呼 ぶ 例 えば 目 次 を 常 に 画 面 上 の 決 まったフレームに 固 定 して 表 示 し 目 次 項

2. 画 面 の 分 割 <frame>タグを 使 用 することにより 1 つの 画 面 を 縦 横 複 数 に 分 割 することがでる 分 割 されたそれぞれ の 画 面 をフレームと 呼 ぶ 例 えば 目 次 を 常 に 画 面 上 の 決 まったフレームに 固 定 して 表 示 し 目 次 項 Web ページ 画 面 構 成 の 技 法 1. 配 置 の 制 御 基 本 的 なタグの 使 い 方 については はじめての HTML などを 通 して 学 習 した ここでは もう 少 し 凝 っ た 画 面 構 成 を 行 うための 基 礎 技 法 について 解 説 する 文 字 や 図 などを 画 面 上 の 任 意 の 位 置 に 配 置 するため には タグを 用 いた 表

More information

CMS操作手順書

CMS操作手順書 モーハワイ ブログ 操 作 マニュアル 目 次 No タイトル 1 フォルダ ファイル 構 成 2 Wordpress の 操 作 3 その 他 のページの 編 集 4 用 語 集 P1 1 フォルダ ファイル 構 成 この 項 ではウェブサイトを 構 成 するフォルダ ファイルについて 説 明 します 1.1 フォルダ 構 造 ファイル 名 フォルダ/ファイル 名 ページ 名 称 フォルダ 内 容

More information

1. 新 しくページを 作 成 する( 無 制 限 タイプ) デザイン 変 更 検 索 1 左 のメニューから デザイン 変 更 をクリックします 2ページタイプが 3 種 類 あります ここでは 無 制 限 タイプ を 選 びます テーマとカラーがありますので ここでデザインを 絞 り 込 むこと

1. 新 しくページを 作 成 する( 無 制 限 タイプ) デザイン 変 更 検 索 1 左 のメニューから デザイン 変 更 をクリックします 2ページタイプが 3 種 類 あります ここでは 無 制 限 タイプ を 選 びます テーマとカラーがありますので ここでデザインを 絞 り 込 むこと ウェブ 作 成 システム Web Factory 1 1. 新 しくページを 作 成 する( 無 制 限 タイプ) デザイン 変 更 検 索 1 左 のメニューから デザイン 変 更 をクリックします 2ページタイプが 3 種 類 あります ここでは 無 制 限 タイプ を 選 びます テーマとカラーがありますので ここでデザインを 絞 り 込 むことが 出 来 ます 1ページタイプ では 情 報

More information

130 11 A B C A B C Ctrl (S) 5 A B C 11.2: 11.1.2 2 11.2 (F) (A) ( OK ) 3 (E) ( ) (E) 11.1.3 3

130 11 A B C A B C Ctrl (S) 5 A B C 11.2: 11.1.2 2 11.2 (F) (A) ( OK ) 3 (E) ( ) (E) 11.1.3 3 129 11 Web IT ( 11.1) 1990 2004 2006 JIS 1 Windows 2 Web Web 11.1: 11.1 11.1.1 1 Ctrl ( ) 11.2 (U) (A) ( OK ) (S) 1 (JIS X 8341-2) (JIS X 8341-3) FAX (JIS X 8341-4) 8341 JIS JIS X8341 http://www.jisc.go.jp/

More information

目 次 第 1 章 GC スクリプトとは?... 4 第 2 章 JavaScript と GC スクリプトの 違 いは?... 6 2-1 jquery とは?... 6 2-2 jquery オブジェクトを 作 ってみよう... 6 2-3 jquery オブジェクトを 既 存 の 要 素 に

目 次 第 1 章 GC スクリプトとは?... 4 第 2 章 JavaScript と GC スクリプトの 違 いは?... 6 2-1 jquery とは?... 6 2-2 jquery オブジェクトを 作 ってみよう... 6 2-3 jquery オブジェクトを 既 存 の 要 素 に GC スクリプト 利 用 ガイド 第 1 版 最 終 更 新 日 2016/03/31 目 次 第 1 章 GC スクリプトとは?... 4 第 2 章 JavaScript と GC スクリプトの 違 いは?... 6 2-1 jquery とは?... 6 2-2 jquery オブジェクトを 作 ってみよう... 6 2-3 jquery オブジェクトを 既 存 の 要 素 に 追 加 してみよう...

More information

1. 目 次 1. 目 次 2.はじめに 2-1.メールテンプレート 編 集 機 能 とは? 2-2. 対 象 読 者 3. 用 語 一 覧 4. 利 用 の 流 れ 4-1.メールテンプレート 編 集 の 流 れ 5. 機 能 説 明 利 用 方 法 5-1.テキストメール 編 集 開 封 率 を

1. 目 次 1. 目 次 2.はじめに 2-1.メールテンプレート 編 集 機 能 とは? 2-2. 対 象 読 者 3. 用 語 一 覧 4. 利 用 の 流 れ 4-1.メールテンプレート 編 集 の 流 れ 5. 機 能 説 明 利 用 方 法 5-1.テキストメール 編 集 開 封 率 を メールテンプレート 編 集 ユーザーマニュアル Ver1.0 2016/5/1 株 式 会 社 シャノン 1 1. 目 次 1. 目 次 2.はじめに 2-1.メールテンプレート 編 集 機 能 とは? 2-2. 対 象 読 者 3. 用 語 一 覧 4. 利 用 の 流 れ 4-1.メールテンプレート 編 集 の 流 れ 5. 機 能 説 明 利 用 方 法 5-1.テキストメール 編 集 開 封

More information

1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................

1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................ HTML 1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................ 4 2..................... 6 3.....................

More information

スライド 1

スライド 1 ネットワーク ウェブサイト 関 連 の 基 本 (おさらい) ファイルの 公 開 ポート:80 (デフォルト) ウェブ サーバー 海 洋 大 のネットワーク プロキシ サーバー ファイルの アップロード 外 部 ネットワーク Apache サーバで ファイルを 公 開 パケットの 監 視 HTML 文 書 の 閲 覧 上 記 のネットワーク 構 成 は プロキシサーバーを 除 いておおよそどこでも

More information

HTML は 本 来 文 書 の 構 造 を 定 義 文 書 の 見 栄 えはスタイルシートで 記 述 HTML HyperText Markup Language 出 典 : フリー 百 科 事 典 ウィキペディア(Wikipedia) HyperText Markup Language(ハイパー

HTML は 本 来 文 書 の 構 造 を 定 義 文 書 の 見 栄 えはスタイルシートで 記 述 HTML HyperText Markup Language 出 典 : フリー 百 科 事 典 ウィキペディア(Wikipedia) HyperText Markup Language(ハイパー Web ページ 作 成 2011/ 5/31 Web ページとは IT 用 語 事 典 e-words より Web ページ web page 読 み 方 : ウェブページ WWW システムを 使 ってインターネット 上 で 公 開 されている 文 書 Web ブラウザに 一 度 に 表 示 されるデータのまとまりで テキストデータや HTML によるレイアウト 情 報 文 書 中 に 埋 め 込

More information

07_経営論集2010 小松先生.indd

07_経営論集2010 小松先生.indd 19 1 2009 105 123 Web Web Web Web World Wide Web WWW OS 1990 WWW Web HTML CSS JavaScript Web 1 WWW 2 Web Web 3 Web 4 HTML5 5 Web Web 3 1970 WWW HTML Web WWW WWW WWW WWW WWW 105 Web WWW 2 Web 1 1 NTT NTT

More information

GMO MobileHomePage

GMO MobileHomePage テンプレート 解 説 書 (キャンペーンサイト) Last update 2010/02/26 1 目 次 1. テンプレート 解 説 書 (キャンペーンサイト)について...3 2. テンプレートを 利 用 した 携 帯 サイト 制 作 方 法...4 3. 全 ページ 共 通 画 像 について...5 4. トップページ 解 説...7 5. 問 題 ページ 解 説...8 6. 正 解 ページ

More information

0序文‐1章.indd

0序文‐1章.indd 本 書 に 記 載 されたURL 等 は 執 筆 時 点 でのものであり 予 告 なく 変 更 される 場 合 があります 本 書 の 使 用 ( 本 書 のとおりに 操 作 を 行 う 場 合 を 含 む)により 万 一 直 接 的 間 接 的 に 損 害 が 発 生 し ても 出 版 社 および 著 者 は 一 切 の 責 任 を 負 いかねますので あらかじめご 了 承 下 さい Microsoft

More information

Microsoft PowerPoint - 第03回目.pptx

Microsoft PowerPoint - 第03回目.pptx 1 情 報 リテラシーII ( 樋 口 担 当 ) 3 回 目 10/10 本 日 の 予 定 2 Webページの 作 成 I.テキストの 記 述 方 法 II.ハイパーリンク III.インラインイメージ( 画 像 ) IV. 表 V. 課 題 3 I.テキストの 記 述 方 法 1. 改 行 4 終 了 タグは 無 い 改 行 していない なすび なすびがいっぱい

More information

Microsoft PowerPoint - 2016_2b-DOM.pptx

Microsoft PowerPoint - 2016_2b-DOM.pptx < 練 習 2-11> DOMの 空 白 ノード 2_nodeVisit の 実 行 結 果 ( 前 ページ)から,HTML をルート 要 素 とするDOMの 木 構 造 を 示 しなさい ただし, 空 白 ノードは 空 白,その 他 のテキストノードは テキスト とすること HTML DOMによる 文 書 データの 参 照 と 変 更 DOMツリー 内 のノード 参 照 相 対 位 置 によるノード

More information

(Microsoft Word - \203v\203\215\203O\203\211\203~\203\223\203O1new.doc)

(Microsoft Word - \203v\203\215\203O\203\211\203~\203\223\203O1new.doc) 1.プログラム 言 語 1-1 プログラム 言 語 の 種 類 プログラム 言 語 は その 言 語 が 目 的 とする 処 理 別 に 基 本 的 な 記 述 概 念 が 存 在 する プログ ラム 言 語 の 種 類 ごとに 記 述 的 特 徴 や 生 産 性 が 異 なる Program 言 語 低 水 準 言 語 マシン 語 アセンブラ 高 水 準 言 語 手 続 き 型 言 語 FORTRAN

More information

<4D6963726F736F667420576F7264202D208FEE95F18F88979D826081408EF68BC697708376838A839383678169506F776572506F696E7491808DEC816A2E646F63>

<4D6963726F736F667420576F7264202D208FEE95F18F88979D826081408EF68BC697708376838A839383678169506F776572506F696E7491808DEC816A2E646F63> PowerPoint 基 本 操 作 P.1 PowerPoint 基 本 操 作 - 目 次 - 1.PowerPoint の 起 動... 2 2.スライドのサンプル... 3 3.スライドの 作 成... 4 4. 文 字 の 入 力... 5 5. 図 の 作 成 (クリップアート)... 6 6.グラフの 作 成... 6 7. 背 景 デザインと 配 色... 7 8.アニメーション 効

More information

Salesforce 便 利 機 能 基 本 編 Outlook Edition ドキュメントタブ 一 括 メール 送 信 差 し 込 み 印 刷 地 図 検 索 路 線 検 索 カスタムリンク 大 規 模 商 談 アラート アップデートリマインダー AppExchange 応 用 編 レポート/ビ

Salesforce 便 利 機 能 基 本 編 Outlook Edition ドキュメントタブ 一 括 メール 送 信 差 し 込 み 印 刷 地 図 検 索 路 線 検 索 カスタムリンク 大 規 模 商 談 アラート アップデートリマインダー AppExchange 応 用 編 レポート/ビ 今 すぐ 使 える!Salesforce 便 利 機 能 ~ 基 本 から 応 用 機 能 まで~ 株 式 会 社 セールスフォース ドットコム Salesforce 便 利 機 能 基 本 編 Outlook Edition ドキュメントタブ 一 括 メール 送 信 差 し 込 み 印 刷 地 図 検 索 路 線 検 索 カスタムリンク 大 規 模 商 談 アラート アップデートリマインダー AppExchange

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション Netto ホームページ 作 成 マニュアル 2015 年 4 月 21 日 作 成 ver8.01 管 理 画 面 URL http://netto.jp/usr/index.php ログインE-mail ( ) パスワード ( ) PC/スマートフォン 対 応 スマートフォンでは 一 部 使 用 出 来 ない メニューがございます ホームページURL http://netto.jp/アカウント

More information

資 料 について 本 資 料 は プレゼンテーションソフト Power Point(パワーポイント)の 基 本 的 な 使 い 方 をまとめたものです はじめの 準 備 1 起 動 すると 右 のような 画 面 が 表 示 されます [ 新 しいプレゼンテーション]をクリックします 2 画 面 上

資 料 について 本 資 料 は プレゼンテーションソフト Power Point(パワーポイント)の 基 本 的 な 使 い 方 をまとめたものです はじめの 準 備 1 起 動 すると 右 のような 画 面 が 表 示 されます [ 新 しいプレゼンテーション]をクリックします 2 画 面 上 平 成 28 年 8 月 25 日 名 古 屋 市 立 桜 丘 中 学 校 名 古 屋 市 情 報 教 育 研 究 会 全 体 研 修 会 資 料 - 0 - 資 料 について 本 資 料 は プレゼンテーションソフト Power Point(パワーポイント)の 基 本 的 な 使 い 方 をまとめたものです はじめの 準 備 1 起 動 すると 右 のような 画 面 が 表 示 されます [ 新

More information

携帯電話でGoogle Mapsを使う

携帯電話でGoogle Mapsを使う PHPのファイルは UTF-8 BOMなしで 保 存 し www.cyaneum.orgのpublic_htmlに 置 く! テーマ 研 究 会 (04/28) Google Mapsを 使 う 政 策 情 報 学 部 渡 辺 恭 人 riho-m@cuc.ac.jp メーリングリスト riho-m-rg10@cuc.ac.jp 資 料 http://www.cuc.ac.jp/rg10/ 前 回

More information

0.CMSホームページについて 1 ブラウザで 学 校 ホームページを 開 いて ログインする! 2 データを 登 録 したいページをメニューから 選 んで 移 動 する 3 編 集 操 作 を 行 い 決 定 ボタンを 押 してデータを 登 録 する 1 入 力 が 終 わったら 必 ず 決 定

0.CMSホームページについて 1 ブラウザで 学 校 ホームページを 開 いて ログインする! 2 データを 登 録 したいページをメニューから 選 んで 移 動 する 3 編 集 操 作 を 行 い 決 定 ボタンを 押 してデータを 登 録 する 1 入 力 が 終 わったら 必 ず 決 定 CMSホームページ 作 成 マニュアル 初 級 編 0.CMSホームページについて 1.. 活 動 報 告 ページへ 記 事 を 登 録 する 2. 文 字 の 色 を 変 える 3. 写 真 など 画 像 を 挿 入 する 4. 画 像 の 右 側 に 文 字 を 配 置 する 5.( 番 外 編 )PDF 文 書 の 作 成 について 6.PDF 文 書 を 登 録 する 7.( 番 外 編 )

More information

2016年COM実験_JavaScript演習資料

2016年COM実験_JavaScript演習資料 COM 実 験 JavaScript 演 習 問 題 2016 年 7 月 14 日 ( 木 ) 山 口 高 平 はじめに 開 発 環 境 の 準 備 JavaScriptの 復 習 演 習 問 題 の 概 要 演 習 問 題 1 演 習 問 題 2 演 習 問 題 3 演 習 問 題 4 演 習 問 題 5 レポート 課 題 の 説 明 目 次 はじめに 演 習 を 通 じてHTMLとJavaScriptの

More information

第3回HP講習会資料ver1.2(2007.9.20)

第3回HP講習会資料ver1.2(2007.9.20) 1.はじめに 第 3 回 技 術 センター 職 員 向 けHP 講 習 会 では スタイルシートの 基 礎 として CSSを 使 った Webページを 作 成 していきます HTMLだけでは 出 来 ないCSSを 用 いたレイアウトを 分 かり 易 く 体 験 してもらえるように 今 回 はCSSの 中 でもクラスやIDといった 概 念 を 省 いています 2.スタイルシートとは? スタイルシート

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション HTMLガイダンス 1 HTMLを 用 いたUI 設 定 2 色 々な 見 え 方 で 画 面 に 表 示 されるWebページ 全 て 文 字 /キャラクタで 表 現 されたデータの 集 まり HTML(Hyper Text Markup Language) パソコン 等 のインターネット 端 末 のブラウザソフトで 文 書 情 報 を 表 示 するときに 用 いられるプログラム 言 語 の 一 種

More information

Microsoft Word - linkad_manual【110418】.doc

Microsoft Word - linkad_manual【110418】.doc リンクアド 設 定 マニュアル リンクアドLLC 1 LinkAd 概 要 図 媒 体 サイト 2 INDEX リンクアド 設 定 の 流 れ 1. 広 告 掲 載 ページに 広 告 配 信 タグを 設 置 する CSVのアップロードを 行 う p.5~p.6 タグが 設 定 されたHTMLをダウンロードする p.7 2. 配 信 したい 広 告 を 登 録 する 媒 体 に 掲 載 する 広 告

More information

JavaScript演習

JavaScript演習 JavaScript 入 門 1 JavaScript( 言 語 )とは 情 報 システムのプログラミング ソースコード 記 述, 外 部 ファイル 保 存, コンパイル,テスト,デバッグ... 大 変 な 作 業 もっと 手 軽 なプログラミング 特 別 な 言 語 処 理 系 は 不 要! Webブラウザだけで 実 行 可 能 ( 実 際 は,HTMLファイル 内 or 外 部 ファイル として

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 1 ましき はぴまるサイト マイホームページ 操 作 説 明 書 平 成 27 年 12 月 2 会 員 登 録 からホームページ 公 開 まで 会 員 仮 登 録 本 登 録 申 請 ログイン センター 承 認 ホームページ 公 開 ホームページ 作 成 ホームページ 作 成 の4つのステップ 1 ホームページの 設 定 (p4) 2 レイアウト デザインの 設 定 (p5) 3 記 事 の 登

More information

Microsoft Word - CMS操作説明会資料.docx

Microsoft Word - CMS操作説明会資料.docx 平 成 25 年 6 月 24 日 株 式 会 社 ネクストワン 1 今 回 の 操 作 説 明 会 では 次 のようなサンプル 記 事 を 作 成 してみたいと 思 います 2 管 理 画 面 にログインする 1. 九 重 町 役 場 ホームページにアクセスします 2.アドレスバーのホームページ URL の 後 ろに admin と 入 力 します http://www.town.kokonoe.oita.jp/admin/index.php

More information

目 次 1. 携 帯 対 応 登 録 ページ... 2 1-1 機 能 概 要... 2 1-2 設 定 方 法... 3 2. 登 録 情 報 変 更 ページ... 4 2-1 機 能 概 要... 4 2-2 設 定 方 法... 4 3. 登 録 情 報 変 更 ページ + 配 信 再 開..

目 次 1. 携 帯 対 応 登 録 ページ... 2 1-1 機 能 概 要... 2 1-2 設 定 方 法... 3 2. 登 録 情 報 変 更 ページ... 4 2-1 機 能 概 要... 4 2-2 設 定 方 法... 4 3. 登 録 情 報 変 更 ページ + 配 信 再 開.. PowerStepMail Regist Manual パワーステップメール レジストマニュアル 2015/03/10 改 定 株 式 会 社 ビズクリエイト 目 次 1. 携 帯 対 応 登 録 ページ... 2 1-1 機 能 概 要... 2 1-2 設 定 方 法... 3 2. 登 録 情 報 変 更 ページ... 4 2-1 機 能 概 要... 4 2-2 設 定 方 法... 4 3.

More information

CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6] 便 利 な 機 能

CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6] 便 利 な 機 能 CMS デザインガイド [1/12] CMS デザインガイド Contents Management System 2006/6/5 CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6]

More information

2 Wee とは Wee はホームページの 更 新 ツールです Wee は サイトの 枠 組 みをWeb 製 作 業 者 が 作 成 し 更 新 は お 客 様 に 自 由 にしていただこうというコンセプトの 製 品 です インターネットに 繋 がる 場 所 ならどこからでも ブラウザでホームページ

2 Wee とは Wee はホームページの 更 新 ツールです Wee は サイトの 枠 組 みをWeb 製 作 業 者 が 作 成 し 更 新 は お 客 様 に 自 由 にしていただこうというコンセプトの 製 品 です インターネットに 繋 がる 場 所 ならどこからでも ブラウザでホームページ 1 ホームページ 更 新 ツール Wee&Wee Mobile のご 紹 介 http//www.i 2 Wee とは Wee はホームページの 更 新 ツールです Wee は サイトの 枠 組 みをWeb 製 作 業 者 が 作 成 し 更 新 は お 客 様 に 自 由 にしていただこうというコンセプトの 製 品 です インターネットに 繋 がる 場 所 ならどこからでも ブラウザでホームページの

More information

Microsoft PowerPoint - css [互換モード]

Microsoft PowerPoint - css [互換モード] 情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく 使

More information