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

Size: px
Start display at page:

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

Transcription

1 Webデータ 管 理 HTML+CSS (4) (2 章 ) 2011/10/26( 水 ) 1/21

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

3 スタイルシート tsujido.css を 開 き 下 記 の 通 り 修 正 してくだ さい body{background-color:#fff8e0;margin:0;} h1{ background-color:#060;color:#fff;font-size:2em; padding:0.5em;margin:0; border-left:solid 20px #030; } h2:first-letter {color:#060;font-size:1.2em;} h2{background-color:#fc6;font-size:1.2em;padding:0.5em;}.head{background-color:#fff;padding:3em;margin:0;}.contents{background-color:#fc6;padding:0.5em;margin:0;}.honbun{background-color:#fff;line-height:1.5;padding:0.8em;textindent:1em;} ( 演 習 1)スタイルシートで1 文 字 目 を 変 更 する 3/21

4 ( 演 習 1) 結 果 4/21

5 ブロックの1 文 字 目 のスタイルを 変 更 する 機 能 値 セレクタ: first-letter {スタイル} 1 文 字 目 のスタイルを 指 定 する フォントや 文 字 色 背 景 色 枠 線 などのスタイル ブロックの1 文 字 目 を 字 下 げする スタイル 機 能 値 text-indent: 字 下 げ 幅 段 落 の1 文 字 目 の 字 下 げ 幅 を 指 定 する em( 標 準 1em) px(ピクセル) pt(ポイント) %など ブロック1 文 字 目 のスタイルを 変 更 する 5/21

6 スタイルシート tsujido.css を 開 き 下 記 の 通 り 修 正 してくだ さい body{background-color:#fff8e0;margin:0;} h1{ background-color:#060;color:#fff;font-size:2em; padding:0.5em;margin:0; border-left:solid 20px #030; } h2:first-letter {color:#060;font-size:1.2em;} h2{background-color:#fc6;font-size:1.2em;padding:0.5em;textalign:center;}.head{background-color:#fff;padding:3em;margin:0;}.contents{background-color:#fc6;padding:0.5em;margin:0;}.honbun{background-color:#fff;line-height:1.5;padding:0.8em;textindent:1em;} ( 演 習 2) 文 字 の 表 示 位 置 を 指 定 する 6/21

7 ( 演 習 2) 結 果 7/21

8 ブロックの 文 字 の 表 示 位 置 を 指 定 する スタイル 機 能 値 text-align: 表 示 位 置 文 字 の 表 示 位 置 を 指 定 する left 文 字 を 左 揃 えで 表 示 する center 文 字 を 中 央 揃 えで 表 示 する right 文 字 を 右 揃 えで 表 示 する justify 文 字 を 両 端 揃 えで 表 示 する justyfyは 日 本 語 の 場 合 無 効 center rightは 短 い 文 章 が 有 効 文 字 の 表 示 位 置 を 指 定 する 8/21

9 スタイルシート tsujido.css を 開 き 下 記 の 通 り 修 正 してください body{background-color:#fff8e0;margin:0;} h1{ background-color:#060;color:#fff;font-size:2em; padding:0.5em;margin:0; border-left:solid 20px #030; } h2:first-letter {color:#060;font-size:1.2em;font-style:italic;} h2{background-color:#fc6;font-size:1.2em;padding:0.5em;textalign:center;letter-spacing:0.5em;font-family: MS P 明 朝, HiraMinProN-W3 ;}.head{background-color:#fff;padding:3em;margin:0;font-weight:bold;}.contents{background-color:#fc6;padding:0.5em;margin:0;}.honbun{background-color:#fff;line-height:1.5;padding:0.8em;textindent:1em;} ( 演 習 3) 文 字 の 装 飾 を 指 定 する 9/21

10 ( 演 習 3) 結 果 10/21

11 太 字 で 表 示 する スタイル 機 能 値 斜 体 で 表 示 する font-weight: 文 字 の 太 さ 文 字 の 太 さを 指 定 する normal 文 字 を 標 準 の 太 さで 表 示 する bold 文 字 を 太 字 で 表 示 する 100~900 文 字 の 太 さを100おきの 数 字 で 表 示 する スタイル 機 能 値 font-style: 文 字 の 種 類 文 字 を 斜 体 で 表 示 するかどうかを 指 定 する normal 斜 体 にせず 文 字 を 標 準 で 表 示 する italic 文 字 をイタリック 体 で 表 示 する oblique 文 字 をオブリーク 体 で 表 示 する 文 字 の 装 飾 を 指 定 する(1) 11/21

12 フォントを 指 定 して 表 示 する スタイル 機 能 値 font-family:フォントの 種 類 フォント 名 文 字 のフォントの 種 類 を 指 定 する serif sans-serif cursive fantasy monospaceなど 文 字 間 を 調 節 して 表 示 する スタイル 機 能 値 letter-spacing: 文 字 の 間 隔 文 字 と 文 字 の 間 隔 を 指 定 する normal 文 字 と 文 字 の 間 隔 を 指 定 しない em( 文 字 サイズ) px(ピクセル 数 ) pt(ポイント 数 )などの 数 値 文 字 と 文 字 の 間 隔 を 数 値 で 指 定 する 文 字 の 装 飾 を 指 定 する(2) 12/21

13 スタイルシート tsujido.css を 開 き 下 記 の 通 り 修 正 してください body{background-color:#fff8e0;margin:0;} h1{ background-color:#060;color:#fff;font-size:2em; padding:0.5em;margin:0; border-left:solid 20px #030; } h2:first-letter {color:#060;font-size:1.2em;font-style:italic;} h2{background-color:#fc6;padding:0.5em;text-align:center;letterspacing:0.5em;font:bold 1.2em MS P 明 朝, HiraMinProN-W3 ;}.head{background-color:#fff;padding:3em;margin:0;font-weight:bold;}.contents{background-color:#fc6;padding:0.5em;margin:0;}.honbun{background-color:#fff;line-height:1.5;padding:0.8em;textindent:1em;} ( 演 習 4)フォント 関 連 のスタイルをまとめて 指 定 する 13/21

14 ( 演 習 4) 結 果 ( 演 習 3と 同 じ) 14/21

15 フォント 関 連 のプロパティの 一 括 指 定 スタイル 機 能 値 font: 斜 体 文 字 の 太 さ 大 きさ/ 行 間 フォント フォント 関 連 のプロパティを 一 括 で 指 定 する font-style/font-weight/font-size/line-height/fontfamilyと 同 じ font : 斜 体 太 さ 文 字 サイズ/ 行 間 フォントの 種 類 font-style font-weight font-size line-height font-family フォント 関 連 のプロパティの 一 括 指 定 15/21

16 HTMLファイル shuuhen.html を 開 き 下 記 の 通 り 修 正 してください 前 略 <title> 辻 堂 周 辺 </title> </head> <body> <h1> 辻 堂 の 周 辺 にあるもの</h1> <div class= shoukai > <h2> 辻 堂 駅 </h2> <p class= honbun > 辻 堂 駅 は 大 正 5 年 12 月 1 日 に 開 業 したJR 東 日 本 東 海 道 線 の 駅 です 出 口 は 北 口 南 口 西 口 の3つがあります </p> </div> <div class= shoukai > <h2> 湘 南 工 科 大 学 </h2> <p class= honbun > 湘 南 工 科 大 学 は1963 年 に 創 立 した 工 学 部 のみの 単 科 大 学 で 機 械 工 学 科 電 気 電 子 工 学 科 情 報 工 学 科 コンピュータ 応 用 学 科 コン ピュータデザイン 学 科 人 間 環 境 学 科 の6 学 科 から 構 成 されます </p> </div> </body> </html> ( 演 習 5-1) 複 数 の 要 素 にまとめてスタイルを 指 定 する 16/21

17 ( 演 習 5-1) 結 果 ( 演 習 4と 同 じ) 17/21

18 スタイルシート tsujido.css を 開 き 下 記 の 通 り 修 正 してください body{background-color:#fff8e0;margin:0;} h1{ background-color:#060;color:#fff;font-size:2em; padding:0.5em;margin:0; border-left:solid 20px #030; } h2:first-letter {color:#060;font-size:1.2em;font-style:italic;} h2{background-color:#fc6;padding:0.5em;text-align:center;letterspacing:0.5em;font:bold 1.2em MS P 明 朝, HiraMinProN-W3 ;margin:0;}.head{background-color:#fff;padding:3em;margin:0;font-weight:bold;}.contents{background-color:#fc6;padding:0.5em;margin:0;}.honbun{background-color:#fff;line-height:1.5;padding:0.8em;textindent:1em;margin:0;}.shoukai{border-left:solid 20px #ccc;margin:1em 0;} ( 演 習 5-2) 複 数 の 要 素 にまとめてスタイルを 指 定 する 18/21

19 ( 演 習 5-2) 結 果 19/21

20 複 数 の 要 素 をまとめて 扱 う タグ 機 能 <div> ~ </div> 複 数 の 要 素 をまとめて 扱 う <div> <h2> ~ </h2> <p> ~ </p> </div> 複 数 の 要 素 をまとめて 扱 う 20/21

21 本 日 の 演 習 内 容 について 復 習 してください 演 習 内 容 作 成 ファイル 演 習 1 スタイルシートで1 文 字 目 を 変 更 する shuuhen.html tsujido.css 演 習 2 文 字 の 表 示 位 置 を 指 定 する shuuhen.html tsujido.css 演 習 3 文 字 の 修 飾 を 指 定 する shuuhen.html index.html tsujido.css 演 習 4 フォント 関 連 のスタイルをまとめて 指 定 する shuuhen.html tsujido.css 演 習 5 複 数 の 要 素 にまとめてスタイルを 指 定 する shuuhen.html tsujido.css HTML+CSS(4)まとめ 21/21

ブロックの 1 文字目のを変更する セレクタ : first-letter { 1 文字目のを指定するフォントや文字色 背景色 枠線などの ブロックの 1 文字目を字下げする text-indent: 字下げ幅段落の1 文字目の字下げ幅を指定する em( 標準 1em) px( ピクセル ) pt(

ブロックの 1 文字目のを変更する セレクタ : first-letter { 1 文字目のを指定するフォントや文字色 背景色 枠線などの ブロックの 1 文字目を字下げする text-indent: 字下げ幅段落の1 文字目の字下げ幅を指定する em( 標準 1em) px( ピクセル ) pt( 演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用できます ) Web プログラミング 1 HTML+CSS (4) (2 章 ) 2013/5/15( 水 ) 演習名 使用するフォルダ 演習 1 Z: Webプログラミング1 20130515 演習

More information

Web データ管理 HTML+CSS (3) (2 章 ) 2011/10/19( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/23

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

More information

クリック クリック リンクを 張 るためのタグ タグ <a href= リンク 先 のURL ファイル 名 > ~ </a> リンク 先 のURLやファイル 名 に 対 してリンクを 張 る 同 じフォルダ 内 のファイルにリンク <a href= hoge.html > フォルダ 内 のファイルに

クリック クリック リンクを 張 るためのタグ タグ <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

スタイルシートでデザインを整えよう

スタイルシートでデザインを整えよう スタイルシートでデザイン(2) CSS (Cascading Style Sheets) ここまで HTML は 文 章 の 意 味 的 な 役 割 を 記 述 するもので 表 示 はブラウザ 次 第 であること を 強 調 してきました あるブラウザでの 表 示 方 法 を 前 提 に HTML で 見 た 目 を 制 御 しようとす ると 他 の 環 境 では 意 味 が 通 じにくい 相 互

More information

Web プログラミング 1 HTML+CSS (3) (2 章 ) 2013/5/8( 水 ) 演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用で

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

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 PowerPoint - HTML1復習_1021.ppt

Microsoft PowerPoint - HTML1復習_1021.ppt HTML-Ⅱ(HTML 文 書 構 造 編 ) 3-1 HTML 基 本 構 造 html おいしいお 店 一 覧

More information

文 書 構 造 とスタイル

文 書 構 造 とスタイル 第 4 回 の 内 容 文 書 構 造 とスタイル CSSの 基 礎 図 表 の 利 用 文 書 構 造 とスタイル 自 己 紹 介 のHTML 文 書 放 送 太 郎 の 自 己 紹 介

More information

Microsoft Word - 2016メディプロ1HTML統合版v1

Microsoft Word - 2016メディプロ1HTML統合版v1 2016 年 度 メディアプロジェクト 演 習 1 HTML 講 座 発 展 編 2 ~ CSS と Web アクセシビリティ 立 命 館 大 学 情 報 理 工 学 部 メディア 情 報 学 科 進 捗 が 遅 れている 場 合 に 限 り,テキスト 中 で 省 略 可 マークのついた 節 は 省 略 してもよい. 1 はじめに 本 演 習 ではこれまで, 様 々なタグを 用 いた 基 礎 的 な

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 データ管理 HTML+CSS (7) (2 章 ) 2011/11/16( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/15

Web データ管理 HTML+CSS (7) (2 章 ) 2011/11/16( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/15 Web データ管理 HTML+CSS (7) (2 章 ) 2011/11/16( 水 ) 1/15 演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用できます ) 演習名 使用するフォルダ 演習 1 Z: Webデータ管理 20111116 演習

More information

CSSの基礎

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

More information

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

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

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

スタイルシートでデザインを整えよう

スタイルシートでデザインを整えよう スタイルシートでデザイン (2) CSS (Cascading Style Sheets) ここまで HTML は文章の意味的な役割を記述するもので 表示はブラウザ次第であることを強調してきました あるブラウザでの表示方法を前提に HTML で見た目を制御しようとすると 他の環境では意味が通じにくい 相互運用性の低い情報となってしまいます Web の表現を作者が指定するには HTML ではなく スタイルシートという別の機能をもちいます

More information

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

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

More information

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

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

More information

スライド 1

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

More information

Web データ管理 HTML+CSS (6) (2 章 ) 2011/11/9( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/21

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

More information

Web プログラミング 1 HTML+CSS (6) (2 章 ) 2013/5/29( 水 ) 演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用

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

More information

HTML5&CSS3 レッスンブック

HTML5&CSS3 レッスンブック STEP 7-6 Chapter 7 FINISHING & ARRANGE style.css STEP 7-6 で 置 き 換 えた style.css の 設 定 です DESIGN POINTS デザインのポイント Google Fontsの Bowlby One で 表 示 ナビゲーションメニューの 各 リンクは 四 角 形 にデザイン コンテンツは 罫 線 で 囲 まない メインコンテンツの

More information

インターネットマガジン1998年11月号―INTERNET magazine No.46

インターネットマガジン1998年11月号―INTERNET magazine No.46 6.2% 4 50.5% 4 3 8.9% 25.3% 3 9.2% 290 INTERNET magazine 1998/11 5 @media H1 { color: #FF0000;

More information

<4D6963726F736F667420576F7264202D20574254816995B68F918DEC90AC89898F4B899E977095D2816A2E646F63>

<4D6963726F736F667420576F7264202D20574254816995B68F918DEC90AC89898F4B899E977095D2816A2E646F63> 文 書 作 成 演 習 ( 応 用 編 ) (Word007,Excel007) 文 書 作 成 演 習 ( 応 用 編 ) のテキストを 参 考 にしながら, 次 の 学 級 だよりを 作 成 してみましょう IPA 教 育 用 画 像 素 材 集 より < 演 習 のための 準 備 > 演 習 用 素 材 のフォルダをデスクトップ 上 に 作 成 します IPA 教 育 用 画 像 素 材 集

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

Cascade Style Sheet

Cascade Style Sheet SmartDoc Cascade Style Sheet http://k-sek01.t-komazawa.ac.jp/ (CSS) CSS HTML 1. HTML HTML HTML 2. HTML 3. HTML CSS. class :link :visited :visited :hover :active 1. { : ; } 2. ":" 3. h1 { font-size: 24pt;

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

(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

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

Web概論

Web概論 HTML/CSS Chapter 04 スタイルシートを使う Copyright 2011 ZDRIVE, K.K. All rights reserved. 4.1 CSS の仕組みと書式 CSS とは Cascading Style Sheet の略 単に スタイルシート と呼ばれることもある HTML で作ったページにレイアウトや装飾などのデザインを施すための仕組み CSS を記述したファイルは.css

More information

Taro-CSS.jtd

Taro-CSS.jtd CSSCascading Style Sheet 1. CSS CSSCascading Style Sheet HTML XHTML, XML HTML CSS HTML/XHTML/XML CSS HTMLXHTML CSS XML CSS 2. CSS HTML/XHTML CSS HTML CSS XML XSL-FO XSLT+CSS CSS Web Web HTML 3. HTML 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

textbook.indd

textbook.indd 02 XHTML+CSS part2 CSS Topics 前 回 習 得 した 基 礎 CSS を 元 に ボックス CLASS ID の 概 念 を 習 得 ボックスレイアウトを 用 いた 2 カラムのサイト 構 築 をします An Introduction to Webdesign + XHTML/CSS Coding 18 01. XHTML+CSS 2 19 20 21 22 23 24

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

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

(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

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

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

More information

地域ポータルサイト「こむねっと ひろしま」

地域ポータルサイト「こむねっと ひろしま」 5. エディタの 使 い 方 5.1. エディタとは? NetCommons の 全 モジュールで 共 通 する 編 集 画 面 です 5.2. 通 常 のエディタの 使 い 方 (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) (11) (12) (13) (14) (15) (16) (17)(18) (19)(20)(21) (22) (23) (24) (25)

More information

2014メディプロ1HTML発展編2

2014メディプロ1HTML発展編2 04 年 度 メディアプロジェクト 演 習 HTML 講 座 発 展 編 ~ CSS と Web アクセシビリティ 立 命 館 大 学 情 報 理 工 学 部 メディア 情 報 学 科 進 捗 が 遅 れている 場 合 に 限 り,テキスト 中 で 省 略 可 マークのついた 節 は 省 略 してもよい. はじめに 本 演 習 ではこれまで, 様 々なタグを 用 いた 基 礎 的 な Web ページの

More information

■新聞記事

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

More information

タイトル 画 像 の 挿 入 <1 行 目 > タイトル 挿 入 セルの 選 択 属 性 セルタブ 参 照 タイトル 画 像 (30title.jp g) 選 択 開 く <2 行 目 > < 左 側 > < 右 側 > < 中 央 > <3 行 目 > 挿 入 セルの 選 択 属 性 セルタブ 参

タイトル 画 像 の 挿 入 <1 行 目 > タイトル 挿 入 セルの 選 択 属 性 セルタブ 参 照 タイトル 画 像 (30title.jp g) 選 択 開 く <2 行 目 > < 左 側 > < 右 側 > < 中 央 > <3 行 目 > 挿 入 セルの 選 択 属 性 セルタブ 参 サムネール ページの 作 り 方 ビルダー 起 動 ファイル 標 準 モードで 新 規 作 成 ページタイトルを 入 れる 画 面 上 の BODY をクリック BODY の 属 性 ページ 情 報 タグ ページタイトル 紫 陽 花 と 入 力 OK 表 の 挿 入 表 の 挿 入 6 行 1 列 OK 属 性 表 タブ 表 の 幅 :750p x Ente r 属 性 セルタブ

More information

名刺作成講習

名刺作成講習 名 刺 作 成 講 習 (Word 2007 編 ) OS:Windows Vista Basic 講 習 内 容 Microsoft Word 2007 でオリジナル 名 刺 の 作 成 名 刺 用 紙 の 確 認 印 刷 用 紙 の 詳 細 を 調 べる ラベル 製 品 名 エーワン 製 品 番 号 A-ONE 51002 用 紙 サイズ A4 列 数 2 行 数 5 上 余 白 11 横 余

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 1 山 都 町 移 住 定 住 サイト マイホームページ 操 作 説 明 書 平 成 26 年 3 月 10 日 2 会 員 登 録 からホームページ 公 開 まで 会 員 仮 登 録 本 登 録 申 請 ログイン センター 承 認 ホームページ 公 開 センター 承 認 公 開 申 請 ホームページ 作 成 ホームページ 作 成 の4つのステップ 1 ホームページの 設 定 (p4) 2 レイアウト

More information

問 題 1 以 下 の 設 問 に 従 って 全 体 を 設 定 し デザインせよ ただし 設 問 で 指 定 された 設 定 以 外 は 既 定 値 のままとする (1) 以 下 の 6 枚 のスライドから 構 成 される 新 しいプレゼンテーションを 作 成 し 実 技 用 フォルダに ガーデニ

問 題 1 以 下 の 設 問 に 従 って 全 体 を 設 定 し デザインせよ ただし 設 問 で 指 定 された 設 定 以 外 は 既 定 値 のままとする (1) 以 下 の 6 枚 のスライドから 構 成 される 新 しいプレゼンテーションを 作 成 し 実 技 用 フォルダに ガーデニ Microsoft PowerPoint プレゼンテーション 技 能 認 定 試 験 初 級 2007 サンプル 問 題 実 技 試 験 制 限 時 間 60 分 受 験 会 場 受 験 番 号 氏 名 問 題 1 以 下 の 設 問 に 従 って 全 体 を 設 定 し デザインせよ ただし 設 問 で 指 定 された 設 定 以 外 は 既 定 値 のままとする (1) 以 下 の 6 枚 のスライドから

More information

1/2

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

More information

スライド 1

スライド 1 アリババ ワールドパスポート 製 品 詳 細 ご 利 用 ガイド 2010/03/11 Ver1.00 2012/10/09 Ver1.50 お 問 い 合 わせ 先 アリババ 株 式 会 社 メール:infoggs@alibaba-inc.jp 103-0007 東 京 都 中 央 区 日 本 橋 浜 町 2-12-4 エスエス 製 薬 本 社 ビル4F 目 次 文 字 装 飾 の 追 加 変 更

More information

Microsoft Word - メディア技術基礎.docx

Microsoft Word - メディア技術基礎.docx メディア 技 術 基 礎 (Web) 脇 田 玲 先 生 (2010) 田 中 浩 也 (2011) HTML の 基 本 的 な 書 き 方 テキストエディタで index.html を 作 成 して 以 下 のサンプルを 入 力 してみましょう 始 めの 2 行 は HTML を 書 く 前 のおまじないの 様 なものです ここで 登 場 する HTML タグについての 説 明 は 以 下 の

More information

CPIについて

CPIについて CP コミュニケーション 関 連 科 目 について 1. 1 年 生 の 教 育 について 後 期 タイプ 練 習 継 続 ワード エクセル パワーポイント 概 論 コンピュータ 入 門 著 作 権 ビデオ 著 作 権 参 考 サイトと 資 料 からレポート 作 成 ( 例 題 ) コンピュータ 入 門 ビデオ 確 認 テスト 回 答 と 説 明 5 巻 終 了 後 まとめ 試 験 (コンピュータ

More information

経営論集2011_07_小松先生.indd

経営論集2011_07_小松先生.indd 20 1 2010 103 125 HTML+CSS HTML CSS CMS Web CMS CMS CMS CMS DreamWeaver Web Web CMS Web Web CSS Web Eclipse HTML CSS Web Web HTML CSS Web HTML CSS Web HTML CSS Web 1 Web Web HTML Web 103 HTML+CSS Web HTML

More information

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

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

More information

/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます " 出 し"の 部 分 をクリックすると"コンテンツですよ "の 字 が 表 されます もう 度 " 出 し"をクリックすると"コンテンツですよ "の 字 が 非 表 になります 折 りたたみパネルの 基

/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます  出 しの 部 分 をクリックするとコンテンツですよ の 字 が 表 されます もう 度  出 しをクリックするとコンテンツですよ の 字 が 非 表 になります 折 りたたみパネルの 基 / 0/0/ : [CSS] 折 りたたみ 可 能 なパネルの 作 成 - CSSのみを 利 した 折 りたたみ 領 域 / アコー ディオンパネル このページのタグ:[CSS] [アコーディオンパネル] 新 着 記 事 覧 タグ 覧 トップページ ipentec.com CSSのみを 利 した 折 りたたみ 可 能 なパネル( 折 りたたみ 可 能 領 域 )を 実 現 するコードを 紹 介 します

More information

untitled

untitled 第 1 節 第 3 章 企 業 ショップ 基 本 情 報 の 登 録 3.2 プレビュー 表 示 機 能 ここでは 基 本 情 報 新 鮮 情 報 商 品 サービス 情 報 クーポン 情 報 求 人 情 報 を 登 録 する 際 に 実 際 の 登 録 処 理 前 に 公 開 側 での 表 示 イメージを 確 認 する 方 法 を 説 明 します 1 基 本 情 報 新 鮮 情 報 商 品 サービス

More information

あいち電子自治体ガイドライン(第1章)

あいち電子自治体ガイドライン(第1章) 1-1 HTML/XHTML 5 1-2 h 6 1-3 TITLE 7 1-4 8 1-5 9 1-6 10 1-7 11 1-8 12 2-1 13 2-2 14 2-3 15 2-4 16 2-5 17 2-6 18 2-7 19 2-8 20 3-1 21 3-2 22 3-3 23 3-4 24 3-5 25 3-6 4 26 3-7 27 3-8 28 - i - 4-1 29 4-2

More information

<5461726F2D89C692EB834E8389837582CC837A815B83808379815B83578DEC>

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

More information

コンピュータ基礎実習(上級) 第二回

コンピュータ基礎実習(上級) 第二回 コンピュータ 基 礎 実 習 ( 上 級 ) 第 四 回 ウェブページの 作 成 について3 清 水 淳 紀 前 回 までの 内 容 ページの 作 成 方 法 ( 編 集 アップロード 確 認 ) ページはKompozer やメモ 帳 等 で 編 集 する ページを 公 開 するには アップロードをする 必 要 がある Internet Explorerなどでページを 開 き F5キーで 表 示 を

More information

合宿事前講座 Web 開発の基本編その 2 情報研究会モブ 薗田海樹 The. H.30 情報研究会 1

合宿事前講座 Web 開発の基本編その 2 情報研究会モブ 薗田海樹 The. H.30 情報研究会 1 合宿事前講座 Web 開発の基本編その 2 情報研究会モブ 薗田海樹 2018 6.12 The. 1 前回の復習 n ブラウザ って何? n Web サイト のキホンを作ってみよう 2 ブラウザ とは?HTML とは?? n ブラウザとは? WEB ページを閲覧するためのソフトウェア p HTML というブラウザに言語を表示する言語によって表示されている n HTML とは? p Hyper Text

More information

WORD 98 入力の手引き

WORD 98 入力の手引き コンピュータ 基 礎 実 習 ( 上 級 ) 第 13 週 スタイルシートの 基 礎 今 回 の 授 業 は スタイルシート(CSS)の 使 い 方 を 解 説 します 1. CSS の 基 本 1.1. CSS とは CSS は Cascading Style Sheets の 略 で ウェブページの 見 栄 えを 設 定 するための 言 語 です CSS は 最 近 多 くのサイトで 使 用 され

More information

KINGSOFT Office 2016 動 作 環 境 対 応 日 本 語 版 版 共 通 利 用 上 記 動 作 以 上 以 上 空 容 量 以 上 他 接 続 環 境 推 奨 必 要 2

KINGSOFT Office 2016 動 作 環 境 対 応 日 本 語 版 版 共 通 利 用 上 記 動 作 以 上 以 上 空 容 量 以 上 他 接 続 環 境 推 奨 必 要 2 目 次 動 作 環 境 特 長 方 法 方 法 起 動 終 了 方 法 方 法 操 作 方 法 使 方 使 方 使 方 詳 細 設 定 使 方 KINGSOFT Office 2016 動 作 環 境 対 応 日 本 語 版 版 共 通 利 用 上 記 動 作 以 上 以 上 空 容 量 以 上 他 接 続 環 境 推 奨 必 要 2 KINGSOFT Office 2016 特 長 主 特 長 以

More information

p { color: yellow } div#hoge { color: green; } div.fuga { color: red; } div { color: orange; } div[id=hoge] { color: blue; } div#hoge

More information

Taro-ホームページB5.jtd

Taro-ホームページB5.jtd 4 タグの 基 本 (Ⅳ) 画 像 基 本 19 1 画 像 を 入 れる 2 画 像 の 大 きさを 指 定 する 3

More information

はじめに確認していただきたいこと

はじめに確認していただきたいこと ページの 内 容 を 編 集 する ページ 内 の 領 域 を 追 加 削 除 したり 修 正 したりして 編 集 します 1 編 集 メニュー 表 示 を 押 す 2 編 集 したい 領 域 の 下 にスクロールする グレーの 帯 が 表 示 されています 3 グレーの 帯 の 部 分 にカーソルを 合 わせる 編 集 メニューが 表 示 されます 4 編 集 したい 内 容 に 合 わせて 操

More information

(1)

(1) 第 回 アビリンピック 京 都 大 会 ホームページ 部 門 練 習 問 題 (1) 仕 様 1 ホームページの 内 容 府 立 京 都 高 等 技 術 専 門 校 のホームページを 作 成 する 2 ページ 構 成 とファイル index.html guid.html course.html mystyle.css ie.css 以 上 のファイルと 素 材 はホームページよりダウンロードして

More information

タグの 内 側 で 関 数 を 定 義 してタグ 側 で 実 行 することもできます <TITLE>JavaScript サンプル</TITLE> 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

A

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

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

2 / 16 ページ 第 12 講 ビジネスプレゼンテーションの 作 成 12-1 プレゼンテーションを 開 く 第 11 講 で 保 存 したファイル プレゼンテーション 学 習.pptx を 開 きましょう 12-2 スライドマスター マスター とはプレゼンテーションの 書 式 を 管 理 して

2 / 16 ページ 第 12 講 ビジネスプレゼンテーションの 作 成 12-1 プレゼンテーションを 開 く 第 11 講 で 保 存 したファイル プレゼンテーション 学 習.pptx を 開 きましょう 12-2 スライドマスター マスター とはプレゼンテーションの 書 式 を 管 理 して 1 / 16 ページ キャリアアップコンピューティング 第 12 講 [ 全 15 講 ] 2016 年 度 2 / 16 ページ 第 12 講 ビジネスプレゼンテーションの 作 成 12-1 プレゼンテーションを 開 く 第 11 講 で 保 存 したファイル プレゼンテーション 学 習.pptx を 開 きましょう 12-2 スライドマスター マスター とはプレゼンテーションの 書 式 を 管

More information

ホームページとは何?

ホームページとは何? ホームページ 作 成 にあたっての 基 本 事 項 ホームページとは? インターネットを 介 して 誰 もが 閲 覧 できるように 作 られたものを ホームページ と 言 います ホームページには 文 字 だけでなく 画 像 や 動 画 音 楽 なども 埋 め 込 むことができま す またホームページに 掲 載 されている 情 報 の 中 でひとまとめに 括 られたものを コンテ ンツ と 呼 んでいます

More information

CSS / 横 1 段 組 レイアウト ビルダー 起 動 新 規 作 成 名 前 を 付 けて 保 存 (ファイル 名 =01turkey-ta.html 保 存 場 所 =css-2) (1)id= contents 用 の 親 DIV タグを BODY の 中 に 入 れる 右 側 の タグ 一

CSS / 横 1 段 組 レイアウト ビルダー 起 動 新 規 作 成 名 前 を 付 けて 保 存 (ファイル 名 =01turkey-ta.html 保 存 場 所 =css-2) (1)id= contents 用 の 親 DIV タグを BODY の 中 に 入 れる 右 側 の タグ 一 外 部 スタイルシート(CSS)の 基 本 1. 外 部 スタイルシートを 作 るには 1Sマークをクリック 2 外 部 スタイルシートの 追 加 参 照 保 存 場 所 image が 入 っているファイルを 選 択 ファイル 名 に 名 前 を 付 ける( 例 index-ta) 保 存 3スタイルシートマネージャーを 閉 じて 上 書 き 保 存 4Sマークをクリック スタイルシート 情 報

More information

Microsoft Word - 203MSWord2013

Microsoft Word - 203MSWord2013 3.1 Word 2013 の 起 動 第 3 章 ワープロ 1.Word 2013 の 起 動 (1)マウスの 左 ボタンでスタートボタンをクリックします (2)[すべてのプログラム] [Microsoft Office 2013] [Word 2013]の 順 にマウスをクリックすると Word 2013 の 初 期 画 面 ( 図 3-1)が 開 かれます クイックアクセスツールバー タイトルバー

More information

分散情報システム構成法

分散情報システム構成法 Web Information System Design No.3 Web 文 書 にスタイルを 付 ける Tatsuya Hagino (hagino@sfc.keio.ac.jp) 1 Webページの 構 成 要 素 直 交 技 術 を 組 み 合 わせる 内 容 スタイル プログラミング スタイル プログラミング JavaScript CSS Webページ Web 文 書 HTML 内 容

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

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

Web09

Web09 情報処理技法 ( マルチメディアと表現 )I 第 9 回 CSS(1) D.Mitsuhashi 1 HTML と CSS D.Mitsuhashi 2 HTML と CSS の役割 HTML 書の構造を すための 語 CSS 書に視覚デザインを与える 語 HTML( 構造化 書 ) が 組みとすると, CSS( スタイルシート ) は外装にあたる D.Mitsuhashi 3 HTML に CSS

More information

Microsoft PowerPoint - CSSガイドライン_201305.ppt [互換モード]

Microsoft PowerPoint - CSSガイドライン_201305.ppt [互換モード] COPYRIGHT 2013 CYBRiDGE CORPORATION COPYRIGHT 2013 CYBRiDGE CORPORATION 2 TEL [] COPYRIGHT 2013 CYBRiDGE CORPORATION 3 CSS CSS2.1 CSS3 CSS CSS3IEhtc js CSS ファイル 名 内 容 格 納 フォルダ common.css style.css xxx.css

More information

Ⅰ Webページの作成

Ⅰ Webページの作成 30 簡 単 なホームページ 制 作 岡 山 県 情 報 教 育 センター 第 1 章 Web コンテンツの 作 成 1 Web ページの 作 成 演 習 ( 自 己 紹 介 ) Web ページ 作 成 演 習 Web HTML Microsoft Internet Explorer4.01 FrontPage Express HTML Web (1) FrontPage Express の 起 動

More information

第 1 章 PowerPoint を 始 める 前 に 第 1 章 PowerPoint を 始 める 前 に 1. 最 初 に 考 えること 2. PowerPoint の 画 面 -1- IBR2012-V1.0

第 1 章 PowerPoint を 始 める 前 に 第 1 章 PowerPoint を 始 める 前 に 1. 最 初 に 考 えること 2. PowerPoint の 画 面 -1- IBR2012-V1.0 パワーポイント 基 礎 講 習 PowerPoint を 始 める 前 に PowerPoint を 始 めよう アニメーションを 活 用 する PowerPoint 2010 対 応 NPO インターネットビジネス 研 究 所 Copyright IBR 2012 第 1 章 PowerPoint を 始 める 前 に 第 1 章 PowerPoint を 始 める 前 に 1. 最 初 に 考

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

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

Microsoft Word - 201009_page新機能について.doc

Microsoft Word - 201009_page新機能について.doc @page 新 機 能 について 1. 全 体 背 景 とページ 背 景 画 像 に 画 像 の 入 力 背 景 にグラデーションを 採 用 する 11. 全 画 面 基 本 項 目 の 設 定 の 実 行 ボタンを 選 択 2 背 景 色 を 白 にし カスタマイズ 画 像 を 使 用 する をチェックする グラデーション 画 像 を 横 に 繰 り 返 し 表 示 を 選 択 背 景 とページを

More information

3. PDF 内 のテキストに 枠 が 表 示 されます 変 更 する 部 分 をクリックし テキストの 追 加 変 更 削 除 などを 行 うことができます フォントの 種 類 や 文 字 サイズなどのスタイル を 変 更 する 場 合 は 次 のステップに 進 みます 2

3. PDF 内 のテキストに 枠 が 表 示 されます 変 更 する 部 分 をクリックし テキストの 追 加 変 更 削 除 などを 行 うことができます フォントの 種 類 や 文 字 サイズなどのスタイル を 変 更 する 場 合 は 次 のステップに 進 みます 2 A. PDF ファイルの 既 存 のテキストを 編 集 する PDF ファイルの 既 存 の 文 章 を 変 更 したり 追 加 削 除 するには 編 集 ツールまたは テキストと 画 像 を 編 集 ツールを 使 用 します PDF ファイルの 既 存 のテキストを 編 集 すると PDF の 内 部 情 報 が 変 更 されたり フォントの 問 題 が 発 生 する 可 能 性 があります 詳

More information

Microsoft PowerPoint - A07回目②.pptx

Microsoft PowerPoint - A07回目②.pptx 1 コンピュータリテラシーII ( 樋 口 担 当 ) 7 回 目 2 11/14 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I. JavaScript( 画 像 関 係 ) II. 課 題 3 I.JavaScript 1.JavaScriptを 使 用 するためのお 約 束 4 の 間 に

More information

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

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

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

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

More information

006-021_責)Wordトレ2-1章_斉

006-021_責)Wordトレ2-1章_斉 . Wordの 起 動 Wordの 基 礎 知 識. Wordの 起 動 Wordの 起 動 は 次 のように 行 います 他 のアプリケーションソフトのように いくつかの 起 動 方 法 があります スタートメニューからの 起 動 スタートメニューから 起 動 する 方 法 は 次 の 通 りです [スタート]メニューの[すべてのプログラム]から[Microsoft-Office]の [Microsoft-Word]を

More information

SXF 仕 様 実 装 規 約 版 ( 幾 何 検 定 編 ) 新 旧 対 照 表 2013/3/26 文 言 変 更 p.12(1. 基 本 事 項 ) (5)SXF 入 出 力 バージョン Ver.2 形 式 と Ver.3.0 形 式 および Ver.3.1 形 式 の 入 出 力 機 能 を

SXF 仕 様 実 装 規 約 版 ( 幾 何 検 定 編 ) 新 旧 対 照 表 2013/3/26 文 言 変 更 p.12(1. 基 本 事 項 ) (5)SXF 入 出 力 バージョン Ver.2 形 式 と Ver.3.0 形 式 および Ver.3.1 形 式 の 入 出 力 機 能 を SXF 仕 様 実 装 規 約 版 ( 幾 何 検 定 編 ) 新 旧 対 照 表 2013/3/26 改 訂 の 要 因 旧 新 (2013 年 4 月 版 ) 文 言 削 除 p.11(1. 基 本 事 項 ) (2) 保 証 すべき 実 数 の 精 度 p.5(1. 基 本 事 項 ) (2) 保 証 すべき 実 数 の 精 度 1. 用 紙 系 ( 線 種 ピッチ 等 用 紙 上 の 大 きさで

More information

27短01研01斉藤.indd

27短01研01斉藤.indd WordPress を用いたホームページ作成 Making a homepage using the WordPress 斎藤敏之 Toshiyuki SAITOH キーワード 1. はじめに WordPress WordPress PC PC WordPress HTML CSS HTML CSS WordPress 2.HTMLとCSSの基礎 HTML CSS World Wide Web Consortium

More information

PowerPoint プレゼンテーション

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

More information

スライド 1

スライド 1 第 5 章 ワープロ B(Word2003) ( 解 答 と 解 説 ) 5B-1. 文 書 の 編 集 1スタイルの 設 定 : 見 出 し1の 設 定 (ア)=I スタイルとは さまざまな 書 式 を 組 み 合 わせて 名 前 を 付 けて 登 録 したものです あらかじめ 用 意 してあるもの 以 外 に 新 規 に 登 録 することもできます ここでは 後 で 使 う 目 次 の 項 目

More information

OpenCity2説明

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

More information

平 成 19 年 度 東 北 地 区 国 立 大 学 法 人 等 技 術 職 員 研 修 日 程 表 ( 情 報 技 術 分 野 ) 時 間 日 8:00 9 月 18 日 ( 山 形 地 区 ) 9 月 19 日 ( 米 沢 地 区 ) 9 月 20 日 ( 米 沢 地 区 ) 9 月 21 日

平 成 19 年 度 東 北 地 区 国 立 大 学 法 人 等 技 術 職 員 研 修 日 程 表 ( 情 報 技 術 分 野 ) 時 間 日 8:00 9 月 18 日 ( 山 形 地 区 ) 9 月 19 日 ( 米 沢 地 区 ) 9 月 20 日 ( 米 沢 地 区 ) 9 月 21 日 平 成 19 年 度 東 北 地 区 国 立 大 学 法 人 等 技 術 職 員 研 修 実 施 要 項 1. 目 的 東 北 地 区 国 立 大 学 法 人 等 技 術 職 員 研 修 実 施 要 項 に 基 づき 東 北 地 区 国 立 大 学 法 人 等 の 技 術 職 員 に 対 し 講 義 実 習 技 術 発 表 等 を 通 して 高 度 の 専 門 知 識 及 び 技 術 等 を 習 得

More information

<4D6963726F736F667420576F7264202D208EA696BC8FF088F38DFC8363815B838B8EE688B590E096BE8F9128312E302E3194C5292E646F6378>

<4D6963726F736F667420576F7264202D208EA696BC8FF088F38DFC8363815B838B8EE688B590E096BE8F9128312E302E3194C5292E646F6378> 取 扱 説 明 書 示 名 条 印 刷 ツール 1.0.1 版 2016 年 4 月 20 日 東 日 本 電 信 電 話 株 式 会 社 目 次 1. ご 使 用 の 前 に 1 2. セットアップ 2 インストール 2 アンインストール 5 3. 起 動 と 終 了 6 ツールの 起 動 6 ツールの 終 了 7 4. 各 機 能 説 明 8 ツールバーの 機 能 8 面 の 作 成 9 面 の

More information

スライド 1

スライド 1 立 命 館 大 学 校 友 会 本 部 提 供 校 友 会 ホームページ 操 作 マニュアル 担 当 : 泉 慎 平 izumi@humanweb.net 株 式 会 社 ヒューマンウェブ 600-8269 京 都 市 下 京 区 七 条 通 堀 川 西 入 ル 朝 日 ビル2F TEL.075-352-3477 FAX.075-352-2877 目 次 各 ページの 説 明 ホームページ 構 成..03

More information

補 図 100 Webページ 制 作 の 流 れ 2 HTML 文 書 とブラウザ 3 作 成 するページ Webページの 作 成 に 用 いるHTMLの これから 作 成 するWebページの 内 容 を 示 した 紹 介 と そのしくみを 簡 単 に 解 説 する リンク 機 能 など 基 本 的

補 図 100 Webページ 制 作 の 流 れ 2 HTML 文 書 とブラウザ 3 作 成 するページ Webページの 作 成 に 用 いるHTMLの これから 作 成 するWebページの 内 容 を 示 した 紹 介 と そのしくみを 簡 単 に 解 説 する リンク 機 能 など 基 本 的 補 充 資 料 8 Webページ 作 成 基 礎 (ホームページビルダー 編 ) いわてEDネットに 接 続 しているすべての 県 立 学 校 での 学 校 Webページの 公 開 が 平 成 15 年 度 まで に 完 了 し 開 かれた 学 校 づくりの 一 環 として 小 中 学 校 や 幼 稚 園 などでも 積 極 的 にWebページの 公 開 が 進 んでいる これらのWebページの 作

More information

Microsoft PowerPoint - 110427b.ppt

Microsoft PowerPoint - 110427b.ppt はじめに 統 計 と 情 報 処 理 第 02 回 後 半 はじめに パスワードの 変 更 キーボードの 特 殊 なキー MS-Wowdの 基 礎 課 題 の 提 出 パスワードの 変 更 パスワードの 変 更 (2) 前 回 計 算 機 実 習 室 のパソコンにログイン するため のパスワードを 変 更 しました 今 回 は メール Web 学 生 サービス 支 援 システム 等 で 利 用 するパスワードを

More information

Microsoft PowerPoint - CSS(Cascading Style Sheets)の基本.pptx

Microsoft PowerPoint - CSS(Cascading Style Sheets)の基本.pptx CSS(Cascading Style Sheets) の基本 1. CSSの基本的な考え方は HTMLの構造を表す要素 ( タグ ) に対しスタイルを定義するというもの 2. CSSでは セレクタ プロパティ 値 の3つを組み合わせてスタイルを設定する 3. セレクタ は ,, や 要素などコンテンツ内のどの要素にスタイルを適用するかを指定する 4. セレクタの次の

More information

(Microsoft PowerPoint -

(Microsoft PowerPoint - 図 面 作 成 は 各 ユーザ 様 の 各 規 定 によって 異 なってきますが その 中 でも 共 通 して 使 用 されると 思 われる 幾 つかの 機 能 作 成 方 法 についてご 紹 介 します オリジナル 図 面 シートの 作 成 について 図 面 シートの 作 成 新 規 のドラフトファイルを 開 き メインメニューの ファイル-シートの 設 定 ダイアログボックスの サイズ タブから

More information

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

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

More information

スライド 1

スライド 1 検 索 エンジンを 利 用 した Covert Channelの 検 出 木 下 研 究 室 200602824 久 保 直 也 研 究 の 背 景 目 的 近 年 ネットワークの 巨 大 化 によりアクセス 権 限 も 複 雑 に 絡 み 合 ってい る ネットワーク 内 では 不 正 な 情 報 経 路 が 発 生 し 情 報 流 出 の 危 険 性 が 増 大 してしまっている このような 情

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

コンピュータリテラシ

コンピュータリテラシ コンピュータリテラシ 第 5 回 表 計 算 1 http://cobayasi.com/jm/5th/5th.pdf /table9.xlsx /table10.xlsx 1 今 日 の 学 習 の 要 点 (テキストP96~141) 表 計 算 ソフト(Excel2013)の 基 本 操 作 基 本 的 なワークシートの 編 集 関 数 を 使 った 計 算 式 小 数 点 とセルの 参 照 2

More information