html_text

Size: px
Start display at page:

Download "html_text"

Transcription

1 HTML の 基 礎 HTML ファイルの 構 成 1.1. HTML とは? Web ブラウザでホームページを 表 示 するためには,HTML(Hyper Text Markup Language)と 呼 ぶ 言 語 で 記 述 す る 必 要 が あ り ま す.HTML 形 式 のファイルは < と > で 囲 んだ 予 約 語 (タグ)を 含 むテキストファイルで,Web ブラウザがこのタグの 意 味 を 解 釈 して, 画 面 に 必 要 な 情 報 を 表 示 します.このタグの 中 には, 画 像 ファイルを 読 み 込 み 表 示 する, このテキスト(または 画 像 )がクリックされたら,どのサーバ ーのどのファイルを 読 み 出 す という 意 味 を 持 つものが 含 まれます. 各 自 の Windows または Mac 端 末 から 例 題 ホームページ( 別 途 リンクを 提 示 )にアクセ スして 各 端 末 のローカルフォルダ(Windows や OSX)にダウンロードしてください 例 題 ホームページのソースを1 行 ずつ 見 ながら その 役 割 と かんたんな 使 い 方 ( 変 更 した 場 合 の 効 果 )を 確 認 しましょう 1.2. タグ タグの 基 本 は, <TAG> </TAG> という 形 をしています. TAG の 部 分 に は 様 々 な 命 令 を す る コ マ ン ド 名 が 入 り,<TAG> と</TAG>で 挟 まれた 部 分 だけにそのタグの 影 響 が 生 じます ドキュメントの 構 成 法 HTML 文 章 は 通 常,エディタを 用 いて 作 成 します.ファイル 名 は, 自 分 のメインのペ ージであれば 通 常 index.html としますが 任 意 のファイル 名 (********.html)で 構 い ません(********は 適 当 な 名 前 です). ファイルの 先 頭 では 通 常 html のバージョン および ファイルの 言 語 などを 示 し ます 例 :html のバージョンが HTML5 で 日 本 語 の 場 合 <!DOCTYPE html><html lang="ja"> 引 き 続 く<HTML>と ファイル 末 尾 の</HTML>はこれが HTML 文 章 であることを 示 すため のタグです. <HEAD>から</HEAD>までがドキュメントについての 情 報 で,ドキュメント 全 体 に 対 す る 命 令 を 記 述 します. 1 / 6

2 <script>から</script>までがプログラム 動 作 を 実 施 させるスクリプトの 定 義 を 行 う 部 分 です 本 部 分 については 説 明 は 省 略 します <BODY>から</BODY>までがドキュメント 本 体 です. 2. <HEAD> </HEAD>で 使 うもの 2.1. <META charset= utf-8 > 文 字 コードを 指 定 するときに 使 用 します. 正 しく 表 示 するためのおまじない <TITLE> </TITLE> ドキュメントのタイトル(ブラウザのタブなどで 見 える 名 前 )を 指 定 するために 使 用 します. 3. <BODY> </BODY>で 使 うもの 3.1. 表 示 エリア 関 係 <body bgcolor="#ffffee" text="#000099" link="#0000ff" vlink="#ff00ff" alink="#ff0000"> それぞれ 背 景 テキスト リンクなどの 色 を 指 定 します <div>, </div> パラメータを 指 定 することで 囲 んでいるエリアの 属 性 を 一 括 して 指 定 できます 例 <div align="center"> </div> 範 囲 内 を 全 てセンター 寄 せにします 3.2. テキスト 関 係 <HR> ブラウザの 左 右 いっぱいに 横 線 を 引 きます.このタグは 単 独 で 使 われます. <b> </b> フォントをボールド( 太 字 にします) <P> 段 落 の 変 更,テキストが 改 行 され,1 行 分 のスペースが 空 きます.これは 単 独 で 使 われます. 2 / 6

3 <BR> 強 制 的 に 改 行 します. 単 独 で 使 われます. <OL><LI> </OL> 番 号 付 きリスト. 各 項 目 の 先 頭 に<LI>をつけます( 表 1). <OL> <LI> 映 画 鑑 賞 <LI> 史 跡 散 策 <LI> 聖 地 巡 礼 </OL> 表 1 番 号 付 きリストの 場 合 <UL><LI> </UL> 番 号 なしリスト. 各 項 目 の 先 頭 に<LI>をつけます( 表 2). <UL> <LI> 映 画 鑑 賞 <LI> 史 跡 散 策 <LI> 聖 地 巡 礼 </UL> 表 2 番 号 なしリストの 場 合 3.3. フォント 関 係 <H1> </H1>,,<H6> </H6> フォントの 大 きさを 変 えるには,<H?> </H?>を 使 います( 表 3).?には,1 か ら 6 までの 数 字 が 入 ります.<H1>が 一 番 大 きく,<H6>が 一 番 小 さくなります.もとも と, 見 出 しの 文 字 サイズを 表 すタグであり,</H?>のあとは 改 行 されます. <font size="6"> </font> という 書 式 も 可 能 <H1> 大 きいフォント</H1> <H3> 標 準 的 なフォント</H3> <H6> 小 さいフォント</H6> 表 3 フォントの 指 定 3 / 6

4 <B> </B> <I> </I> これら 二 つは 物 理 タグと 呼 ばれ,フォントの 種 類 を 直 接 指 定 します.<B> </B>は 太 文 字,<I> </I>はイタリック( 斜 体 )にします イメージ 関 係 <IMG SRC= url > HTML 文 章 中 に 画 像 を 貼 付 けるために 使 います.url には 画 像 の 所 存 を 表 す URL を 書 きます. 画 像 ファイルのフォーマットは,GIF 形 式 が 標 準 となっています. <IMG SRC= url ALT= text > テキストブラウザでアクセスしてくる 人 のために, 画 像 の 代 わりに 表 示 する 文 字 を 指 定 するには ALT オプションを 使 います. 例 :<IMG SRC= face.gif ALT= (^_^) > 3.5. 表 の 作 成 表 組 みをするための 基 本 的 なタグは,<TABLE> </TABLE>ですが,このままでは 罫 線 が 入 りません.そのために BORDAR オプションを 指 定 します. <TABLE BORDAR> </TABLE>で 囲 んだ 部 分 を 表 環 境 と 呼 びます. 表 環 境 は 入 れ 子 にし て 使 うことができます. 次 に, 行 の 定 義, 見 出 しの 定 義,データの 定 義 に 使 うタグを 示 します( 表 4). <TR> </TR> <TH> </TH> <TD> </TD> 表 4 表 の 作 成 に 用 いるタグ 行 を 定 義 します. 横 1 行 ごとにこのタグを 使 います. 属 性 を 見 出 しとして 指 定 します. 属 性 をデータとして 指 定 します. <TABLE BORDER= 1 >とすると, 例 題 ファイルのように 表 示 されます. 1 は 罫 線 の 太 さで, 数 字 が 小 さいほど 細 い 線 になります.この 例 では,データが 左 寄 りになっ ています.これを 中 央 揃 えにするには,<TD ALIGN= center >210 本 </TD>のように し, 右 寄 せにするには center を right にします.その 行 全 体 を 右 寄 せにする には 次 のようにします.<TR ALIGN= right > </TR> 4 / 6

5 3.6. リンク 関 係 任 意 のテキストやインラインイメージをリンクの ボタン として,そこから 他 の HTML 文 章 や 画 像 等 にリンクを 張 ることができます. <A HREF= url > </A> url の 部 分 には HTML 文 章 や 画 像 ファイル 等 の URL を 記 述 します. の 部 分 にはボタ ンとなるテキストやインラインイメージを 書 きます( 表 5). 表 6 リンクの 設 定 <A HREF= (ここに URL を 記 述 ) >(ここに 表 示 するテキストを 記 述 )</A> <A HREF= (ここに URL を 記 述 ) ><IMG SRC= image.gif ></A> 4. 実 際 に 作 ってみる 学 内 においてホームページを 公 開 するときは 次 のマナーを 必 ず 守 ってください. 特 に 2 や 4 に 反 すると 訴 えられることがあります ホームページをもつ 上 での 注 意 事 項 1. ホームページを 通 じて 商 売 をしない. 2. 他 人 や 団 体 を 傷 つける 内 容 は 載 せない. 3. 公 序 良 俗 に 反 する 内 容 は 掲 載 しない.またリンクしない. 4. 他 人 ( 他 の 団 体 )の 著 作 権 を 侵 害 しない.すなわち, 他 人 の 作 った 画 像, 文 章, ソフトウエアは 許 可 がない 限 り 勝 手 に 載 せない. [その 他 の 注 意 事 項 ] 5. 自 分 の 家 の 電 話 番 号 や 自 宅 住 所 を 載 せない.メールアドレス 程 度 にしておく ホームページ 作 成 手 順 1. 例 題 ホームページを 修 正 して 自 分 のホームページを 作 成 2. Apache を 起 動 している 仮 想 マシンに ホストマシン(Windows や OSX)から FTP で 接 続 3. ローカルフォルダのホームページを 仮 想 マシンにアップロード root 内 の public_html ディレクトリに, 作 成 したファイルを 配 置 する. 4. ブラウザから 名 /****.html にアクセスし, 自 分 のホームページを 見 る. 5 / 6

6 4.3. 補 足 事 項 通 常,file.html という 名 前 でファイルを 作 った( 配 置 した)とすると,そのファ イルの URL は,http://ホスト 名 /file.html となります.ただし,index.html という ファイル 名 の 場 合 のみ,http://ホスト 名 のように 省 略 できます. サブページを 作 る 場 合,やはり 同 じ html 形 式 で 作 ります.そのページをリンクす る 場 合 は index.html と 同 じディレクトリにある 場 合 は,<A HREF= sub1.html > </A>のように 書 けばいいのですが, 同 じ 並 びのディテクトリ dir1 の 下 にある 場 合 に は,<A HREF= dir1/sub.html > </A>のように 書 くことができます.Index.html の 上 のディレクトリにある 場 合 には,<A HREF=../sub1.html > </A>と 書 くこと ができます. 5. 演 習 html を 用 いて 各 自 のホームページを 作 って メインページをキャプチャして 提 出 し て 下 さい 6 / 6

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

(0) 準 備 自 分 のUSBメモリのなかに 自 分 の 学 番 の 名 前 をつけたフォルダを 作 成 する( 例 :5210001) 以 下 で 作 成 使 用 する HTML 文 書 や 画 像 ファイルはすべてこのフォルダの 中 に 作 成 すること (1)テキストエディタで HTML 文

(0) 準 備 自 分 のUSBメモリのなかに 自 分 の 学 番 の 名 前 をつけたフォルダを 作 成 する( 例 :5210001) 以 下 で 作 成 使 用 する HTML 文 書 や 画 像 ファイルはすべてこのフォルダの 中 に 作 成 すること (1)テキストエディタで HTML 文 情 報 リテラシー 第 13 回 ウェブページの 作 成 と 更 新 インターネットによって 世 界 中 の 人 に 瞬 時 に 情 報 を 伝 えることができるようになった ウェブページ はその 情 報 発 信 基 地 である ここではウェブページの 作 り 方 を 学 ぶ コンピュータ ストアにはたくさ んのウェブページ 作 成 ソフトが 市 販 されており 操 作 法 はソフトによって 様 々である

More information

モール管理者マニュアル Ver.1.0

モール管理者マニュアル Ver.1.0 1 Html 編 集 ツール 補 足 マニュアル Ver.1.0 株 式 会 社 ソフトクリエイト 2012/11/14 目 次 1. Html について... 3 1.1. Html とは... 4 1.2. Html タグの 基 本... 5 1.2.1. HTML タグの 基 礎... 5 1.2.2. HTML タグの 種 類 ( 主 要 タグ)... 7 2. Html 編 集 ツール...

More information

■新聞記事

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

More information

第7章 Webページによる情報の発信

第7章 Webページによる情報の発信 筑 波 大 学 情 報 処 理 実 習 Webページによる 情 報 の 発 信 情 報 処 理 実 習 用 手 引 き P.197~226 World Wide Web (WWW) インターネット 上 のハイパーテキストシステム 1989 年 にCERNの 物 理 学 者 Tim Berners-Leeが 発 明 WWWはインターネットとも 呼 ばれるが, 両 者 は 同 義 語 ではない WebページのアドレスURL

More information

HTML文章作成

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

More information

Lecture/CompPracR2003/12th

Lecture/CompPracR2003/12th Lecture/CompPracR2003/12th 2016 年 7 月 17 日 コンピュータ 演 習 ( 再 ) 第 12 回 (1) Webページの 作 成 (1) Webページを 作 成 する 道 具 (1) テキストエディタを 使 うメリット デメリット (2) HTML (2) HTMLとは (2) HTMLの 書 き 方 (3) HTMLファイルの 構 造 (3) 空 白 と 改 行

More information

eil2009062930_4.ppt

eil2009062930_4.ppt URL (Universal Resource Locator) WWW (World Wide Web) URL http://www.cs.kumamoto-u.ac.jp/ Web ftp://ftp.cc.kumamoto-u.ac.jp/ FTP (File Transfer Protocol) FTP World Wide Web (WWW) Web HTTP (HyperText Transfer

More information

ホームページ制作スターターズ

ホームページ制作スターターズ HTML タグ はじめての 方 ガイド Ver1.0 1 < 目 次 > 1ホームページ 構 造 2HTML タグ 3スタイルシート Copyright ナレッジコーディネーター All Rights Reserved. 2 第 1 章 ホームページ 構 造 Copyright ナレッジコーディネーター All Rights Reserved. 3 1HTMLとは ウェブ 上 の 文 書 を 記 述

More information

情報処理実習(工基3)

情報処理実習(工基3) 情 報 ( 実 習 )( 体 育 4 班 ) 第 4 回 ホームページ 篇 今 週 は 皆 さんにホームページを 作 って 頂 きます ホームページ 作 成 を 通 じて 様 々な 情 報 を 発 信 したり 受 信 したりする 方 法 のひとつとなることを 目 指 します 0 はじめに はじめに 筑 波 大 学 のホームページ(HP と 略 )を 見 てみましょう デスクトップ 上 にある Internet

More information

Microsoft Word - chap2.doc

Microsoft Word - chap2.doc 第 2 章 ホームページとHTML(タグ) ここでは HTML タグについて 今 まで 使 う 機 会 が 無 かった 学 生 を 対 象 に 説 明 する 既 に HTML タグを 使 ったことのある 学 生 にとっては 知 っている 話 になると 思 うので ざっと 目 を 通 すだけでよいだろう 初 めての 学 生 は 演 習 等 を 通 じて 使 い 慣 れて 欲 しい [1] HTML 通

More information

Microsoft Word - 1-html.doc

Microsoft Word - 1-html.doc Web ページ 作 成 の 基 礎 の 基 礎 内 容 : 1. HTML の 仕 組 み 2. HTMLの 文 法 2007-11-16 テキスト 原 案 作 成 原 田 隆 史 ( 慶 應 義 塾 大 学 ) 協 力 : 石 田 栄 美 ( 駿 河 台 大 学 ), 新 居 雅 行 (Apple Japan), 中 島 玲 子 1.Web ページの 仕 組 みと 作 成 1. Web ページを

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 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

: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1

: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1 : 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1 2 : : 1 1 : 3 : 2 (.ppsx) (A0nxxyyy.ppsx) presen (1 ) ID:A0nxxyyy Name: Title: 3 HTML (HyperText Markup Language) 4 ( ) http://pweb.cc.sophia.ac.jp

More information

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

Microsoft PowerPoint - hp2.ppt [互換モード] 技 術 センター HP 講 習 会 ( 第 2 回 ) 広 島 大 学 技 術 センター HP 運 用 WG 本 日 の 講 習 会 の 流 れ FTPソフトの 使 い 方 ファイルをサーバにアップロードする 方 法 前 回 ( 第 1 回 )の 復 習 とその 応 用 フォルダ(ディレクトリ)とリンクの 関 係 リンクの 仕 組 み: 絶 対 パスと 相 対 パス パスワードによるアクセス 制 限

More information

6 2 1

6 2 1 6 1 6 (1) (2) HTML (3) 1 Web 1 Web Web 1 Web HTML 6 2 1 6 3 1.1 HTML(XHTML) Web HTML(Hyper Text Markup Language) ( ) html htm HTML HTML5 takahagi

More information

22. 情 報 の 発 信 伝 達 コミュニケーション Ustream :2007 年 にジョン ハム ブラッド ハンスタブル ジュラ フェヘルに よって 設 立 された 動 画 共 有 サービス 元 々は3 人 が 開 発 した イラク 戦 争 に 派 兵 された 友 人 達 と 家 族 のための

22. 情 報 の 発 信 伝 達 コミュニケーション Ustream :2007 年 にジョン ハム ブラッド ハンスタブル ジュラ フェヘルに よって 設 立 された 動 画 共 有 サービス 元 々は3 人 が 開 発 した イラク 戦 争 に 派 兵 された 友 人 達 と 家 族 のための 2016 年 度 春 学 期 ( 月 V/ 火 II ) 情 報 情 報 発 信 と 伝 達 22. 情 報 の 発 信 伝 達 コミュニケーション 23. 情 報 発 信 のためのHTMLの 基 礎 最 初 に 講 義 資 料 は http://astro.u-gakugei.ac.jp/~nishiura 西 浦 クンの 講 義 室 に 縮 小 版 (PDFファイル)を 置 く 予 定 東 京

More information

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

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

More information

HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:<...>で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd 他 に loose.dtd,frameset.d

HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:<...>で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd 他 に loose.dtd,frameset.d 第 10 回 HTMLの の 基 礎 HTMLとは 作 成 手 順 基 本 形 改 行 と 段 落 整 形 済 みテキスト 横 線 見 出 し リスト1(UL,OL) リスト2(DL) インライン 画 像 リンク HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd

More information

第 5 部 コンピューターの 仕 組 み 保 存 ができたら 第 21 章 で 作 っていた hello.html に 手 を 加 えて 上 書 き 保 存 し ブラウザーで 確 認 してみよう 例 7: 画 像 を 入 れる

背 景

第 5 部 コンピューターの 仕 組 み 保 存 ができたら 第 21 章 で 作 っていた hello.html に 手 を 加 えて 上 書 き 保 存 し ブラウザーで 確 認 してみよう 例 7: 画 像 を 入 れる <html> <body bgcolor=yellow> <p> 背 景 第 22 章 ウェブページの 作 成 2 画 像 の 表 示 HTMLの 細 かいタグ 自 己 紹 介 ページの 作 成 1. 画 像 を 入 れる Word の 画 面 で 画 像 ( 写 真 や 絵 )を 入 れるときは イメージそのものを 表 示 し たが ウェブページに 画 像 を 入 れるには メモ 帳 の 画 面 で 直 接 画 像 を 表 示 させることはできない 作 業 している HTML

More information

Microsoft PowerPoint - manualtachiyomi.pptx

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

More information

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

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

More information

Microsoft Word - wsample.docx

Microsoft Word - wsample.docx 2013.10 情 報 科 学 A 補 足 資 料 Web ページ 作 成 のポイントとサンプルデータ HTML 作 成 のポイント テキストエディタ (EmEditor, メモ 帳 など) でテキストファイルとして 作 成 する Microsoft Expression Web など,Web ページ 作 成 専 用 のソフトウエア (オーサリングソフト) を 用 いるこ ともできる HTML(HyperText

More information

橡ホームページの作り方

橡ホームページの作り方 1. 1.1. HTML Word HTML(Hyper Text Markup Language) html htm MS-WORD MS-WORD HTML HTML HTML (1.0) 1 1978 7 10 S 3

More information

HTML文書の作成

HTML文書の作成 99 C HTML 1 1 2 HTML 1 3 2 4 HTML 2 4.1... 2 4.2... 3 4.3... 5 5 HTML 8 5.1... 8 5.2... 10 5.3... 12 6 HTML 13 7 13 1 HTML HTML [1] 2 HTML HTML Hyper-Text Markup Language World Wide Web (WWW)[2] HTML Hyper-Text

More information

第7章 Webページによる情報の発信

第7章 Webページによる情報の発信 筑 波 大 学 情 報 処 理 実 習 Webページによる 情 報 の 発 信 情 報 処 理 実 習 用 手 引 き P.193~234 World Wide Web (WWW) インターネット 上 のハイパーテキストシステム 1989 年 にCERNの 物 理 学 者 Tim Berners-Leeが 発 明 WWWはインターネットとも 呼 ばれるが, 両 者 は 同 義 語 ではない WebページのアドレスURL

More information

HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17

HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17 1 11 13 2 11 27 3 12 11 HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17 WWW(World Wide Web) HTML(HyperText Markup Language) HTML HTML HTML HTML - 1 - .1 HTML (V)(C) HTML - 2 - HTML HTML OS Windows 2.1 HTML

More information

1 1 1.1............................. 1 1.2....................... 1 2 HTML 2 2.1 web HTML......................... 2 2.1.1 HTML.................... 2

1 1 1.1............................. 1 1.2....................... 1 2 HTML 2 2.1 web HTML......................... 2 2.1.1 HTML.................... 2 XHTML DOM JavaScript 2 2008 7 1 1 1 1.1............................. 1 1.2....................... 1 2 HTML 2 2.1 web HTML......................... 2 2.1.1 HTML.................... 2 2.1.2 HTML.........................

More information

アフィリエイターの為のHTML

アフィリエイターの為のHTML アフィリエイターが 覚 えておくべき HTML 辞 典 著 作 権 について このレポートは 著 作 権 法 で 保 護 されている 著 作 物 です このレポートの 著 作 権 はやまひろに 属 します 著 作 権 者 の 許 可 なく このレポートの 全 部 又 は 一 部 を いかなる 手 段 においても 複 製 転 載 流 用 転 売 等 することを 禁 じます このレポートに 書 かれた

More information

ホームページの作成

ホームページの作成 HTML5,CSS 資 料 HTML5 HTML の 文 法 HTML(Hyper Text Markup Language)は, 文 章 の 部 分 を Tag(タグ)と 呼 ばれ る 命 令 で 挟 んでいく タグは ... 開 始 終 了 のように 開 始 タグと 終 了 タグ 一 対 のペアになっている. タグは, 挟 まれた 部 分 がどのような 情 報 であるかを

More information

Microsoft Word - 第4&5回HTML&MIFES入門.doc

Microsoft Word - 第4&5回HTML&MIFES入門.doc 第 4&5 回 HTML & MIFES 入 門 水 野 りか ここでは,いわゆるホームページを 作 成 する 方 法 の 基 礎 を 学 びます ホームページを 作 るための 言 語 は,HTML (Hyper Text Makeup Language)と 呼 ばれています この 言 語 を 書 くためのテキスト エディタが MIFES です HTML で 書 かれたページは,Netscape や

More information

3 1 5 1.1....................................... 6 1.2.......................................... 6 1.3..................................... 7 1.4.................................... 8 1.4.1.............................

More information

スライド 1

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

More information

1 1 1........................... 1 2.............................. 1 3........................ 2 2 3 1...................... 3 2.....................

1 1 1........................... 1 2.............................. 1 3........................ 2 2 3 1...................... 3 2..................... CSS 0348085 1 1 1........................... 1 2.............................. 1 3........................ 2 2 3 1...................... 3 2..................... 3 3........................... 5 3 CSS

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

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

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

More information

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

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

More information

3 システム 概 要 ウェブ アプリケーションによる 情 報 収 集 シ ステムの 概 要 をユースケース 図 にて 示 す( 図 1) 途 中 まで 行 い 一 時 的 にサーバに 格 納 しておき 再 度 先 ほどの 途 中 から 記 入 できるようになっている つまり 1 日 に 何 度 も1

3 システム 概 要 ウェブ アプリケーションによる 情 報 収 集 シ ステムの 概 要 をユースケース 図 にて 示 す( 図 1) 途 中 まで 行 い 一 時 的 にサーバに 格 納 しておき 再 度 先 ほどの 途 中 から 記 入 できるようになっている つまり 1 日 に 何 度 も1 XMLとExcelを 利 用 したWebによるアンケート 収 集 システム の 構 築 Synthesis a new web application system using XML, php and Excel 福 良 博 史 伊 東 久 美 子 荻 野 美 佐 子 FUKURA Hirofumi, Ito Kumiko, Ogino Misako 1 はじめに 0 歳 ~2 歳 の 主 として

More information

1/2

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

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

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

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

HTML入門

HTML入門 HTML ABC of Hyper Text Markup Language 2009 2 HTML2009 Copyright 2009 by BohYoh Shibata 3 WWW HTML WWW WWWworld wide web hyper text resource 4 HTML2009 http WWW httphyper text transfer protocol HTML HTMLhyper

More information

1 1.1 1.2 1.3 (a) WYSIWYG (What you see is what you get.) (b) (c) Hyper Text Markup Language: SGML (Standard Generalized Markup Language) HTML (d) TEX

1 1.1 1.2 1.3 (a) WYSIWYG (What you see is what you get.) (b) (c) Hyper Text Markup Language: SGML (Standard Generalized Markup Language) HTML (d) TEX L A TEX HTML 2000 7 2 ([-30]5051.49) 1 2 1.1.............................................. 2 1.2.............................................. 2 1.3................................................ 2 1.4.............................................

More information

Microsoft PowerPoint - css [互換モード]

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

More information

Web情報システム 第1章~第5章

Web情報システム 第1章~第5章 Web 情 報 システム マルチメディア 情 報 通 信 ソフトウェア 第 1 章 ~ 第 4 章 1 Web 情 報 システム マルチメディア 情 報 の 流 通 Web 情 報 システム 概 論 デジタルメディアの 特 徴 デジタルメディアの 記 述 HTML (Hyper Text Markup Language) Css (Cascading style sheet) デジタルメディアの 制

More information

1 全 体 のレイアウトを 把 握 する 2 段 組 レイアウト 1 段 組 レイアウト 左 サイドメニューが 表 示 され, 新 着 記 事 が 一 覧 (または 簡 略 形 式 ) 投 稿 した 記 事 が, 日 付 順 にそのまま 表 示 される で 表 示 される 管 理 メニュー(ダッシュ

1 全 体 のレイアウトを 把 握 する 2 段 組 レイアウト 1 段 組 レイアウト 左 サイドメニューが 表 示 され, 新 着 記 事 が 一 覧 (または 簡 略 形 式 ) 投 稿 した 記 事 が, 日 付 順 にそのまま 表 示 される で 表 示 される 管 理 メニュー(ダッシュ 編 集 者 ユーザー 用 CONTENTS 全 体 のレイアウトを 把 握 する... 1 管 理 メニュー(ダッシュボード)へログインする... 1 ダッシュボードの 見 方 を 覚 える... 2 新 規 投 稿 の 方 法 について... 3 投 稿 記 事 を 編 集 する... 4 メディア( 外 部 ファイル)を 追 加 する... 5 別 のサイトへリンクする... 6 HTML 編

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

PowerPoint プレゼンテーション

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

More information

Microsoft PowerPoint - lecture1210.pptx

Microsoft PowerPoint - lecture1210.pptx HTML: HyperText Markup Language 1 ウェブページ 作 成 名 古 屋 大 学 情 報 基 盤 センター 情 報 基 盤 ネットワーク 研 究 部 門 嶋 田 創 通 常 のウェブページはHTMLで 記 されている URLの 最 後 が.htmlで 終 わっている( 右 下 図 )ことが 多 いのはそのせい Windowsは 拡 張 子 が.htmlもしくは.htmの

More information

1 2 3 図 4 図 5?? 部 分 は, 各 自 が 用 意 したメディアに 合 わせて 選 択 する (5) 画 面 の 指 示 に 従 い 作 業 を 進 め, 最 後 までできれば,メール 環 境 の 構 築 は 終 了 うまくいかない 場 合, 学 術 情 報 センターで 指 導 を 受

1 2 3 図 4 図 5?? 部 分 は, 各 自 が 用 意 したメディアに 合 わせて 選 択 する (5) 画 面 の 指 示 に 従 い 作 業 を 進 め, 最 後 までできれば,メール 環 境 の 構 築 は 終 了 うまくいかない 場 合, 学 術 情 報 センターで 指 導 を 受 13.パーソナルコンピュータ 実 習 [Ⅱ] 実 験 受 講 前 の 準 備 編 以 下 の 確 認 を 行 っていない 場 合,この 実 験 テー マを 受 講 することはできません 1. 学 情 センターの UNIX のパスワードの 確 認 2.E-Mail が 使 えることを 確 認 手 順 1(UNIX パスワードの 確 認 ) (1) 中 部 大 学 内 のパソコンで FFFTP を 立

More information

Webデザインの基礎01

Webデザインの基礎01 Webデザインと 広 告 広 報 電 子 商 取 引 &ビジネス 情 報 管 理 1.Web 社 会 を 知 る ウェブで 私 達 の 生 活 はどう 変 わったのか? インターンネットの 検 索 機 能 を 活 用 した 情 報 収 集 ソーシャルネットワークによ るユーザ 同 士 の 情 報 共 有 価 格 ドットコム, 食 べログ 社 会 全 体 の 情 報 の 流 れが, 個 から 個 へ,

More information

A

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

More information

CSSの基礎

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

More information

演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z: W

演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z: W Webデータ 管 理 HTML+CSS (4) (2 章 ) 2011/10/26( 水 ) 1/21 演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z:

More information

Microsoft Word - 2010.09.doc

Microsoft Word - 2010.09.doc 情 報 基 礎 実 習 9 回 HTML の 仕 組 み 2010 年 6 月 17 18 日 長 谷 川 秀 彦 逸 村 裕 本 日 のメニュー HTML ( Hyper Text Markup Language ) を 使 って 箇 条 書 き 画 像 他 のファイルへ のリンクなどを 組 み 込 んだ Web ページを 作 成 し Word, Excel, PowerPoint や 専 用 の

More information

2. HTML 2 3. 1 1 100 6 4. csh AWK 4. 4. AWK 1., 2., 3. 2 HTML HTML HyperText Markup Language WWW WWW (.html

2. HTML 2 3. 1 1 100 6 4. csh AWK 4. 4. AWK 1., 2., 3. 2 HTML HTML HyperText Markup Language WWW WWW (.html 1. 1 AWK HTML 18 8 14 1 HTML Yahoo! 3 Yahoo! (http://www.yahoo.co.jp/) 1 Yahoo! : http://headlines.yahoo.co.jp/hl ( ) ( ) Netscape 3.04 1. 2 Netscape 3.04 2. 1 Yahoo! 2. HTML 2 3. 1 1 100 6 4. csh AWK

More information

スライド 1

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

More information

情報公開システム論2.pptx

情報公開システム論2.pptx 情 報 公 開 システム 論 (2) 神 戸 情 報 大 学 院 大 学 横 山 輝 明 電 子 文 書 としてのWebページ 2 ホームページ(1) ホームページ 自 由 に 作 成 安 価 世 界 中 に 公 開 多 彩 な 表 現 力 双 方 向 性 - 島 根 県 立 大 学 - 島 根 県 立 大 学 短 期 大 学 部 h,p://www.u- shimane.ac.jp/ 3 ホームページ(2)

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

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

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

More information

第 1 章 インターネットとホームページの 基 礎 知 識 この 章 では 日 常 的 に 使 っている 用 語 の 意 味 や 使 い 方 の 確 認 をします よくわからずに 使 っていたり 間 違 って 覚 えていたりすることは 珍 しくありません 最 初 に 正 しい 知 識 と 用 語 の

第 1 章 インターネットとホームページの 基 礎 知 識 この 章 では 日 常 的 に 使 っている 用 語 の 意 味 や 使 い 方 の 確 認 をします よくわからずに 使 っていたり 間 違 って 覚 えていたりすることは 珍 しくありません 最 初 に 正 しい 知 識 と 用 語 の Web クリエイター 能 力 認 定 試 験 初 級 テキスト HTML 4.01 対 応 1 / 278 第 1 章 インターネットとホームページの 基 礎 知 識 この 章 では 日 常 的 に 使 っている 用 語 の 意 味 や 使 い 方 の 確 認 をします よくわからずに 使 っていたり 間 違 って 覚 えていたりすることは 珍 しくありません 最 初 に 正 しい 知 識 と 用

More information

学生用_目次

学生用_目次 メーリングリストを 削 除 する 1.メーリングリストの 管 理 画 面 にログインします 2. このメーリングリストを 削 除 する のリンクをクリックします 3.リストのパスワードを 入 力 して [このリストを 削 除 ]をクリックしま す * 一 度 削 除 したメーリングリストは 元 に 戻 せませんので 十 分 注 意 してください 自 分 のためのデータの 保 存 場 所 それが ホームディレクトリ

More information

簡単なアイコンの説明

簡単なアイコンの説明 Joruri CMS 1.3.2 基 本 マニュアル (2013.6.28) 付 録 内 容 の 入 力 内 容 文 字 装 飾 表 の 挿 入 添 付 ファイルのアップロード リンク 設 定 株 式 会 社 アイ ディ エス Joruri 操 作 マニュアル/ 内 容 の 入 力 機 種 依 存 文 字 はご 利 用 しないでください 下 記 のようなウィンドウズに 依 存 する 機 種 依 存

More information

ホームページの仕組み

ホームページの仕組み 見 やすいホームページを 作 ろう! 跡 見 学 園 女 子 大 学 公 開 講 座 文 学 部 准 教 授 福 田 博 同 平 成 23 年 5 月 7 日 14 日 目 次 5 月 7 日 1. ショートカットキー 2. HTMLの 仕 組 み 3. XHTMLとCSS 4. W3C 標 準 5. 見 本 に 書 き 込 む 6. 単 語 登 録 5 月 14 日 1. ブログを 試 そう 2.

More information

KITENN 編集操作マニュアル

KITENN 編集操作マニュアル KITENN 編 集 操 作 マニュアル 目 次 操 作 方 法 基 本 編 自 分 のページをブラウザで 開 く ログイン 方 法 編 集 画 面 の 開 き 方 文 章 を 入 力 する 画 像 メディアファイルを 挿 入 する 文 字 スタイル( 太 字 斜 体 )を 変 更 する 文 字 配 置 ( 左 揃 え 中 央 揃 え 右 揃 )を 変 更 する リンクを 作 成 する 画 像 横

More information

Fckeditor の 基 本 的 な 使 い 方 Point!! fckeditor を 上 手 く 使 うコツ 始 めにページ 内 に 一 通 り 文 章 ( 画 像 や 表 を 含 む)を 書 いてから 文 字 装 飾 をして 下 さい 編 集 したいテキストや 画 像 を 選 択 し アイコ

Fckeditor の 基 本 的 な 使 い 方 Point!! fckeditor を 上 手 く 使 うコツ 始 めにページ 内 に 一 通 り 文 章 ( 画 像 や 表 を 含 む)を 書 いてから 文 字 装 飾 をして 下 さい 編 集 したいテキストや 画 像 を 選 択 し アイコ Fckeditor マニュアル 目 次 Fckeditor の 基 本 的 な 使 い 方... 2 記 事 の 登 録 プレビューの 前 に... 2 リンクを 挿 入... 5 画 像 を 挿 入 する... 6 PC に 保 存 している 画 像 の 挿 入... 6 WEB 上 の 画 像 を 挿 入... 8 文 字 装 飾... 10 文 章 を 見 出 しにする... 10 太 文 字

More information

Microsoft Word - 2009.06.doc

Microsoft Word - 2009.06.doc 情 報 基 礎 実 習 第 6 回 HTML の 仕 組 み 2009 年 5 月 28 29 日 長 谷 川 秀 彦 逸 村 裕 本 日 のメニュー HTML ( Hyper Text Markup Language ) を 使 って 箇 条 書 き 画 像 他 のファイルへ のリンクなどを 組 み 込 んだ Web ページを 作 成 する Word, Excel や 専 用 の Web ページ

More information

データ構造とアルゴリズム論

データ構造とアルゴリズム論 第 1 章.Web サーバとしての Tomcat の 機 能 学 習 のねらい 1 テキストファイルおよび HTML ファイルをブラウザに 表 示 させ Tomcat の Web サー バとしての 機 能 を 確 認 理 解 する 0.Web アプリケーションの 動 作 の 仕 組 み 講 義 で 説 明 基 礎 課 題 1-1 (Java サーブレットを 用 いた)Web アプリケーションの 動

More information

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

Microsoft Word - 100303中級マニュアル.doc

Microsoft Word - 100303中級マニュアル.doc SHIFT 中 級 マニュアル 1. 画 面 の 構 成 を 考 えましょう (1) 基 本 的 な 構 成 壱 岐 市 商 工 会 基 本 情 報 代 表 者 名 郵 便 番 号 住 所 TEL FAX メールアドレスを 登 録 します 代 表 者 名 郵 便 番 号 住 所 TEL は 必 須 です メールアドレスを 登 録 すると メール で 問 い 合 わせがあります 不 要 なDMを 誘

More information

(Microsoft Word - CSS\202P\201i\212\356\226{\202P_.doc)

(Microsoft Word - CSS\202P\201i\212\356\226{\202P_.doc) スタイルシート ( 第 1 章 基 礎 1) HTMLはWeb 作 成 用 の 言 語 ですが 文 字 飾 りがかなり 貧 弱 です そこを 強 化 した ものがスタイルシートと 言 われるものです さらにスタイルシートには HTMLでは 出 来 ないような 仕 組 みも 取 り 入 れられています スタイルシートよりレベルの 高 い 技 術 は JavaScript ですが スタイルシートの 仕

More information

Microsoft PowerPoint - JohoEnshuu07_06.ppt

Microsoft PowerPoint - JohoEnshuu07_06.ppt 情 報 活 用 演 習 07 第 六 回 ~~Linuxシステム/コマンドの 使 い 方 ~~ 担 当 : 水 野 恒 史 居 室 : 理 学 部 物 理 科 学 科 高 エネルギー 宇 宙 研 究 室 ( 理 学 部 B210 号 室 ) 電 子 メール:tsune@hiroshima-u.ac.jp ホームページ:http://home.hiroshima-u.ac.jp/tsune/ 1 前

More information

untitled

untitled MoogaOne 1. MoogaOne... 1 2. MoogaOne... 1 3.... 1 4.... 1 5.... 2 6.... 2 1.... 2 2.... 2 3. Template.htm... 2 4. index.htm... 4 [ ]... 4 5.... 4 6.... 6 7.... 6 8.... 6 [Template.htm Template-e.htm

More information

情報資源組織演習B:

情報資源組織演習B: 情 報 資 源 組 織 演 習 A( 書 誌 の 作 成 ) 第 12 回 書 誌 データ 管 理 検 索 システムの 構 築 2013 年 度 跡 見 学 園 女 子 大 学 文 学 部 准 教 授 福 田 博 同 書 誌 データ 管 理 検 索 システムの 構 築 第 9 回 で 書 誌 データベース 構 築 は 理 解 Web 検 索 では 以 下 の 様 な 方 法 が 取 られる A B

More information

Microsoft Word - 内容の入力.doc

Microsoft Word - 内容の入力.doc Joruri 操 作 マニュアル/ 内 容 の 入 力 機 種 依 存 文 字 はご 利 用 しないでください 下 記 のようなウィンドウズに 依 存 する 機 種 依 存 文 字 については 他 のパソコン 環 境 やブラウザにより 表 示 されません 記 事 の 保 存 時 にシステムでエラーが 出 るように 設 定 されています 利 用 しないようにお 願 いします 機 種 依 存 文 字 (

More information

OpenCity2説明

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

More information

スタイルシートを 用 いた Web ページの 運 用 静 岡 大 学 工 学 部 技 術 部 太 田 諭 之, 大 橋 和 義, 後 藤 克 嘉, 水 野 保 則 tsoota@ipc.shizuoka.ac.jp 1.はじめに 静 岡 大 学 工 学 部 技 術 部 のホームページは 2008 年

スタイルシートを 用 いた Web ページの 運 用 静 岡 大 学 工 学 部 技 術 部 太 田 諭 之, 大 橋 和 義, 後 藤 克 嘉, 水 野 保 則 tsoota@ipc.shizuoka.ac.jp 1.はじめに 静 岡 大 学 工 学 部 技 術 部 のホームページは 2008 年 Departmental Bulletin Paper / 紀 要 論 文 スタイルシートを 用 いたWebページの 運 用 太 田, 諭 之 ; 大 橋, 和 義 ; 後 藤, 克 嘉 ; 水 野, 保 則 技 術 職 員 による 技 術 報 告 集. 2009, 17, p. 24-27. http://hdl.handle.net/10076/10274 スタイルシートを 用 いた Web ページの

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

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

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

More information

<925393968ED28CA48F438E9197BF875428303731313031292E786C73>

<925393968ED28CA48F438E9197BF875428303731313031292E786C73> NECユーザー 会 実 務 担 当 者 研 修 会 資 料 平 成 19 年 11 月 1 日 - NECユーザー 会 ユーザーシステム 研 究 会 - 於 仙 台 市 情 報 産 業 プラザ 東 日 本 硝 子 業 厚 生 年 金 基 金 目 次 ~ 本 研 修 のテーマ Yahoo(ヤフー)のブリッフケースがあれば FDUもCD- ROMもいらない P2~3 ~ 無 料 インターネット 上 に300メガの

More information

(Microsoft Word - Easy\203y\201[\203W\221\200\215\354\203K\203C\203h.doc)

(Microsoft Word - Easy\203y\201[\203W\221\200\215\354\203K\203C\203h.doc) Easy ページ 操 作 ガイド http://359ch.com ところチャンネル( 資 ) Easy ページサービス 操 作 ガイド 2009.1.8 版 1. はじめに Easy ページサービスとは パソコンからブラウザを 利 用 して 簡 単 にホームページを 公 開 更 新 できるサービス です Docomo や AU SoftBank 等 の 携 帯 電 話 を 利 用 して 同 様 にホームページを

More information

スライド 1

スライド 1 e 研 修 PDCA 運 用 チェック Simple e-learning Management System Plus 操 作 説 明 書 管 理 者 機 能 ( 運 用 チェックテーマ 資 材 作 成 管 理 編 ) 05 年 月 Ver..7 アーチ 株 式 会 社 機 能 e 研 修 管 理 機 能 LOGIN 画 面 (PC 環 境 用 ) 説 明 e 研 修 管 理 機 能 LOGIN

More information

Taro-01_Web_html自習テキストⅠ.

Taro-01_Web_html自習テキストⅠ. 平 成 18 年 度 学 校 Web ページ 作 成 研 修 講 座 HTML の 基 礎 Ⅰ ~メモ 帳 で Web ページを 作 ろう!!~ 今 回 の 勉 強 内 容 メモ 帳 /ファイルの 保 存 / 文 字 入 力 /ページタイトルの 設 定 文 字 色 の 設 定 / 文 字 サイズの 設 定 / 水 平 線 /リンクの 設 定 岩 手 県 立 総 合 教 育 センター 情 報 教 育

More information

3. 管 理 画 面 (ダッシュボード) ログインすると 下 図 のダッシュボードの 画 面 となります ( 権 限 によって 左 のメニューが 異 なります ) 4.ブログの 投 稿 方 法 管 理 画 面 の 左 側 のメニューから 投 稿 をクリックします ここに 投 稿 された 公 開 記

3. 管 理 画 面 (ダッシュボード) ログインすると 下 図 のダッシュボードの 画 面 となります ( 権 限 によって 左 のメニューが 異 なります ) 4.ブログの 投 稿 方 法 管 理 画 面 の 左 側 のメニューから 投 稿 をクリックします ここに 投 稿 された 公 開 記 2011.12.8 カメリア パルの 会 ホームページ 編 集 マニュアル http://pal.nono1.jp 1.はじめに カメリア パルの 会 のホームページは フリーのブログシステム(WORDPRESS)を 使 用 してい ます このシステムの 特 徴 としては ブログの 基 本 的 使 用 方 法 である 日 記 を 追 加 するだけでなく 固 定 的 なページを 作 成 することができ

More information

Microsoft Word - 2014第10&11回HTML入門.doc

Microsoft Word - 2014第10&11回HTML入門.doc 第 10 & 11 回 HTML 入 門 水 野 りか ここでは,いわゆるホームページを 作 成 する 方 法 の 基 礎 を 学 びます ホームページを 作 るための 言 語 は,HTML (Hyper Text Markup Language)と 呼 ばれています この 言 語 はどんなエディタやワープロ ソフトでも 書 くことができますが, 本 講 では, Windows 標 準 のメモ 帳

More information

[1] 概 略 の 流 れ 概 略 の 流 れは 下 図 の 通 りです 1 本 ソフトの 環 境 設 定 2 ホームページに 編 集 開 始 文 1 行 を 書 き 込 む ( 例 ) 3 管 理 者 用 パスワードでログイン 4 管 理 画 面 で 必 須 デー

[1] 概 略 の 流 れ 概 略 の 流 れは 下 図 の 通 りです 1 本 ソフトの 環 境 設 定 2 ホームページに 編 集 開 始 文 1 行 を 書 き 込 む ( 例 ) <!-- start01 --> 3 管 理 者 用 パスワードでログイン 4 管 理 画 面 で 必 須 デー 操 作 説 明 書 目 次 [1] 概 略 の 流 れと 環 境 設 定 -------------------------- 1 [2] 設 置 方 法 と 起 動 ----------------------------------- 3 [3] ログインと 設 定 ----------------------------------- 5 [4] 必 須 の3 項 目 の 入 力 -----------------------------

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 Word - 2016メディプロ1HTML統合版v1

Microsoft Word - 2016メディプロ1HTML統合版v1 2016 年 度 メディアプロジェクト 演 習 1 HTML 講 座 基 礎 編 立 命 館 大 学 情 報 理 工 学 部 メディア 情 報 学 科 1 はじめに 本 演 習 の 最 初 の 4 回 では,HTML JavaScript を 用 いた Web ページ 作 成 の 基 礎 知 識 を 学 びます. Web ページを 作 成 するには, 次 の 2 通 りの 方 法 が 考 えられます.

More information

Microsoft Word - HTML.docx

Microsoft Word - HTML.docx ホームページを 見 る 環 境 (Web ブラウザの 種 類 やバージョン, 画 面 サイズなど)は 多 種 多 様 であり, 自 分 が 見 ている 状 態 と 必 ずしも 同 じではないことを 前 提 に 作 成 して ください 1 1. 文 書 のレイアウト, 文 字 の 書 式 原 則 として,タグと 属 性 は 大 文 字, 属 性 の 値 は"で 囲 んだ 小 文 字 で 記 述 します

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

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

ホームページの作り方 講習会テキスト ホームページ 作 成 ソフト (ホームページ ビルダー) 講 習 会 テキスト 2014 年 度 版 (141110 更 新 ) 明 治 大 学 メディア 支 援 事 務 室 目 次 目 次... 2 1. 概 要... 3 1.1 ページ 公 開 の 仕 組 み... 3 1.2 HTMLと タグ... 4 2. コンテンツ( 素 材 )の 作 成... 4 2.1 準 備... 4 2.2 ホームページ

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

Microsoft Word - infA-2011-11a-html.doc

Microsoft Word - infA-2011-11a-html.doc WWW の 仕 組 みと HTML ファイル 1.WWW(World Wide Web)の 仕 組 みと 基 礎 用 語 通 常 Web ページを 閲 覧 する 際 には Web ブラウザと 呼 ばれるアプリケーションを 使 用 し 閲 覧 したい HTML 1 ファイルの 送 信 を そのファイルを 持 つ Web サーバ(WWW サーバ)に 依 頼 する( 図 11) Web サー バは 依 頼

More information

目 次 兵 庫 県 社 会 福 祉 協 議 会 ウェブアクセシビリティ 対 応 ホームページ 更 新 ガイドライン... 1 目 次... 2 ガイドラインの 目 的... 3 適 用 範 囲... 3 根 拠 となる 規 格 またはガイドライン 類... 3 1. 文 章 の 作 成 時 の 注

目 次 兵 庫 県 社 会 福 祉 協 議 会 ウェブアクセシビリティ 対 応 ホームページ 更 新 ガイドライン... 1 目 次... 2 ガイドラインの 目 的... 3 適 用 範 囲... 3 根 拠 となる 規 格 またはガイドライン 類... 3 1. 文 章 の 作 成 時 の 注 兵 庫 県 社 会 福 祉 協 議 会 ウェブアクセシビリティ 対 応 ホームページ 更 新 ガイドライン 社 会 福 祉 法 人 兵 庫 県 社 会 福 祉 協 議 会 1 目 次 兵 庫 県 社 会 福 祉 協 議 会 ウェブアクセシビリティ 対 応 ホームページ 更 新 ガイドライン... 1 目 次... 2 ガイドラインの 目 的... 3 適 用 範 囲... 3 根 拠 となる 規 格

More information

目 次 1. はじめに...1 1.1. What's new?について... 1 1.1. 他 者 に 著 作 権 のあるファイル... 1 1.2. 再 頒 布 または 変 更 する 場 合 の 注 意... 1 1.3. 連 絡 先... 1 1.4. 最 新 版 のダウンロード... 2 2

目 次 1. はじめに...1 1.1. What's new?について... 1 1.1. 他 者 に 著 作 権 のあるファイル... 1 1.2. 再 頒 布 または 変 更 する 場 合 の 注 意... 1 1.3. 連 絡 先... 1 1.4. 最 新 版 のダウンロード... 2 2 What'snew? ユーザーズマニュアル WhatsNew.exe Version 1.0 用 Copyright (C) 2001-2004 Fumio KAWAMATA 目 次 1. はじめに...1 1.1. What's new?について... 1 1.1. 他 者 に 著 作 権 のあるファイル... 1 1.2. 再 頒 布 または 変 更 する 場 合 の 注 意... 1 1.3.

More information

雛形ホームページ利用マニュアル

雛形ホームページ利用マニュアル ご 参 考 資 料 アカデミックサーバ 用 雛 形 ホームページ ご 利 用 ガイド < 本 ガイドのご 利 用 にあたって> アカデミックサーバ は ご 利 用 される 学 校 様 が ご 自 身 で コンテンツの 作 成 FTP によるファイル 転 送 などを 行 っていただくことが 前 提 です 従 いまして 上 記 に 関 するサポートや 本 説 明 書 の 記 載 内 容 に 関 するサポートは

More information