2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正

Size: px
Start display at page:

Download "2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正 "

Transcription

1 1 情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく 使 われているのはCSS2 (version 2) W3Cで 推 奨 される 考 え 方 W3Cで 推 奨 される 考 え 方 論 理 構 造 :マークアップ 言 語 HTML, XHTML, XMLなど レイアウト( 見 た 目 ):スタイルシート 言 語 CSSなど 1990 Web 登 場 HTMLはWebページの 論 理 構 造 を 記 述 するもので レイアウトを 記 述 するものではない レイアウトを 記 述 するためのスタイルシート 言 語 は 規 定 されなかった 1993 頃 以 降 ブラウザ 普 及 サイト 製 作 者 は 見 た 目 をよくしたい ブラウザにあわせてレイアウト 記 述 例 ) 文 字 を 大 きくしたいときに<h3>を 使 う ブラウザによって 異 なる 独 自 要 素 も 登 場 例 )<font> HTMLの 混 乱 と 複 雑 化 1996 レイアウトを 記 述 する 枠 組 としてCSSが 規 定 (CSS1) 1997 HTML3.2: 折 衷 的 なHTML 暫 定 的 措 置 としてレイアウトに 関 する 独 自 要 素 の 取 り 入 れ 1997 HTML4.0: 論 理 構 造 とレイアウトの 分 離 1998 CSS HTML XHTML XHTML1.1 現 在 : 依 然 として 混 沌 状 態 CSSを 使 わないページが 多 い CSSを 使 う 場 合 :HTML4.01 or XHTML1.0 or CSS2が 一 般 的 注 意 :CSS 規 定 以 前 に 開 発 されたブラウ ザはCSSに 対 応 していない

2 2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正 しく 伝 達 できる 表 示 の 間 違 いを 減 らせる 維 持 管 理 が 楽 に アクセシビリティ 向 上 例 )HTMLのtable 要 素 を 使 ってレイアウトすると 音 声 読 み 上 げソフトを 利 用 してWebページを 聞 く 視 覚 障 害 者 に 正 しく 情 報 が 伝 わりにくい レイアウトに 関 する 記 述 を 外 部 CSSファイ ルにできる サイトの 維 持 管 理 が 楽 に( 後 述 ) ユーザが 自 分 の 好 きなスタイルシートで ページを 見 ることができる 正 しい( 推 奨 される) 考 え 方 CSSのメリットの 例 (1) CSSのメリットの 例 (1) New という 文 字 列 の 色 を 赤 から 黄 色 に かえたい 場 合 100ページ(100 個 のHTMLファイル)の Webサイト HTMLファイル <font color= red >New</font> 100 個 のHTMLファイルで redをyellowに 変 更 HTML <span class= attention >New</span> attention( 名 前 は 自 由 ) というclassを 設 定 100 個 のHTMLファイルは 変 更 不 要 CSS( 別 ファイル).attention color: yellow; CSSのメリットの 例 (2) CSSのメリットの 例 (2) <h1>の 下 に 下 線 をひきたい 場 合 100ページ(100 個 のHTMLファイル)の Webサイト 1 個 のCSSファイルにおいて attention の 色 を redからyellowに 変 更

3 3 HTMLファイル <h1> 適 当 な 見 出 し</h1> <hr color= lime size= 5 > 100 個 のファイルHTMLで<hr>の colorとsize 設 定 変 更 注 :HTMLでは <hr>には 本 来 color, size 属 性 はなく ブ ラウザ 独 自 要 素 HTML <h1> 適 当 な 見 出 し</h1> <hr>は 不 要 100 個 のHTMLファイルは 変 更 不 要 CSS( 別 ファイル) h1 border-bottom: solid 5px lime; 1 個 のCSSファイルの<h1>の 設 定 変 更 課 題 課 題 2. Konqueror, Mozilla(Linux), Internet Explorer(Windows)で 確 認 3. Another HTML LintまたはW3C HTML ValidatorでHTML 文 法 チェック, W3C CSS ValidatorでCSS 文 法 チェック 課 題 ( 余 裕 のある 人 ) 課 題 ( 余 裕 のある 人 ) 4. 画 像 ファイルをimagesディレクトリにま とめる 5. 2ページ 目 以 降 もCSSを 用 いて 作 り 直 す 一 般 的 なディレクトリ 構 成 一 般 的 なディレクトリ 構 成 public_html(ディレクトリ) css(ディレクトリ) index.css( 名 前 は 自 由 ) images(ディレクトリ) index.html 他 のHTMLファイル 課 題 の 手 順 ( 準 備 ) 課 題 の 手 順 ( 準 備 ) 0. 見 本 の 確 認 以 下 index.html, profile.html, hobby.html css/index.css images/photo.gif コピーして 使 用 してもよい

4 4 1.1 cssという 名 前 のディレクトリをpublic_htmlの 下 に 作 成 1.2 index.cssという 名 前 ( 名 前 は 自 由 )のファイルを cssの 下 に 作 成 1.3 index.htmlをtest.htmlという 名 前 で 保 存 (バック アップのため) 1.4 test.htmlからindex.cssを 参 照 <link rel= stylesheet type= text/css href= css/index.css > 1.4 ボックスのレイアウトを 考 える( 見 本 参 照 ) 1.5 ボックスとその 内 容 の 記 述 をtest.htmlに 行 う(HTML) 1.6 ボックスの 見 た 目 をindex.cssに 記 述 する (CSS) 注 )1.5, 1.6 は 上 から 順 番 に 少 しずつ 行 う 注 )CSSで 記 述 しやすいようにデザインを 変 更 してもよい 1.7 完 成 したらindex.htmlをindex.html.bakと いう 名 前 で 保 存 し(バックアップのため) test.htmlをindex.htmlの 名 前 で 保 存 2. Konqueror, Mozilla, Internet Explorer で 確 認 3. HTMLとCSSの 文 法 チェック 3.1 Another HTML Lint or HTML Validator 3.2 CSS Validator 4. 画 像 ファイルをimagesディレクトリにま とめる 4.1 public_htmlの 下 にimagesディレクトリを 作 成 4.2 画 像 ファイル(.jpg,.gifなど)をimagesディ レクトリに 移 動 4.3 HTMLファイルの 中 の 画 像 へのパスを 変 更 して 保 存 例 )<img src= photo.gif >を<img src= images/photo.gif >に

5 5 5. 2ページ 目 以 降 もCSSを 利 用 して 書 き 直 す 手 順 は1.と 同 じ 参 考 参 考 Webページを 作 ろう とほほのスタイルシート 入 門 参 考 参 考 Another HTML Lint html W3C HTML Validator W3C CSS Validator 見 本 の 基 本 レイアウト (トップページ) photo menu description wrapper header footer 見 本 の 基 本 レイアウト (2ページ 目 ) menu2 wrapper header marginとpadding page footer padding border margin 要 素 の 中 身

6 6 marginとpaddingの 記 述 方 法 marginとpaddingの 記 述 方 法 margin: 0; 上 下 左 右 が0 margin: 0 auto; 上 下 が0 左 右 は 中 央 揃 え margin: ; 上 右 下 左 が0 個 別 に 指 定 するときは margin-left, margin-right, margin-top, margin-bottom 例 ) margin-left: 100; CSSファイルの 見 方 CSSファイルの 見 方 HTML:ブラウザで ドキュメントのソース を 表 示 CSS:HTMLを 見 てCSSファイルのURLを ブラウザで 入 力 CSS 利 用 の 問 題 CSS 利 用 の 問 題 HTMLより 仕 様 が 複 雑 CSSに 対 応 していないブラウザもある ユーザがスタイルシートを 利 用 しないこともある ブラウザによってCSS 対 応 状 況 が 異 なり バグ もある CSSの 文 法 通 りに 記 述 しても 正 しく 表 示 されな いことがある ブラウザの 対 応 度 合 いの 差 は HTMLのより 大 きい 複 数 のブラウザで 美 しく 正 しく 表 示 させるため には 多 くの 手 間 と 時 間 とノウハウが 必 要 どうすればいいか 100% 正 しい という 答 えはない 見 た 目 に 全 くこだわらないのであれば CSSを 使 わず HTMLにレイアウトに 関 する 記 述 を 書 かない という 選 択 肢 もある 見 た 目 に 多 少 でもこだわるのであれば ブラウザの 対 応 状 況 を 考 慮 しながら できる 範 囲 でCSSを 用 いたページ 作 成 が 望 ましい

Microsoft PowerPoint - css [互換モード]

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

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

第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 で 見 た 目 を 制 御 しようとす ると 他 の 環 境 では 意 味 が 通 じにくい 相 互

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

山梨県ホームページ作成ガイドライン

山梨県ホームページ作成ガイドライン 17 7 ...1...4...4...4...4...5...5 W3C...5...6...6...6...7...8...8...10...10...10... 11...12...12...13...13...13...14...14...14...15...15...16...16...16...16...16...17...18 15 (2003 ) 69.7 81.1 43.6 19.6

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

スタイルシートを 用 いた 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

Network Computing の基礎

Network Computing の基礎 CSS Cascading Style Sheets Cascading = Style Sheets = CSS WEB HTML CSS 2 HTML h1 p CSS 3 CSS CSS HTML sample1.html CSS HTML sample2.html CSS CSS sample2.css CSS

More information

文 書 構 造 とスタイル

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

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

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

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

More information

WORD 98 入力の手引き

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

More information

CSSの基礎

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

More information

Web10.pptx

Web10.pptx 情 報 処 理 技 法 (マルチメディア)I 1 第 10 回 CSS 基 礎 (2) 2 HTML5 コンテンツモデル 3 コンテンツモデル HTML5 のタグは 7つのカテゴリに 分 けられるコン テンツモデルを 採 用 している コンテンツモデルから 要 素 の 中 に 何 を 含 んでよい かが 決 定 される 参 考 W3C: HTML5 content models http://www.w3.org/tr/2011/wd-html5-20110525/content-models.html

More information

1 1 1............................ 1 2.............. 1 3................... 1 4...................... 1 5 Web................. 2 6.....................

1 1 1............................ 1 2.............. 1 3................... 1 4...................... 1 5 Web................. 2 6..................... web 0448039 1 1 1............................ 1 2.............. 1 3................... 1 4...................... 1 5 Web................. 2 6...................... 3 7 HTML CSS.................... 3 8....................

More information

インターネットマガジン2004年3月号―INTERNET magazine No.110

インターネットマガジン2004年3月号―INTERNET magazine No.110 C S S text & photo: Kaminogoya 2xUP http://2xup.boo.jp/ 1 2 3 106 +++ internet magazine 2004.03 +++ c s s CSS Technique 01.blogbody blockquote{ background-color: #CCCCCC; /* */ border-left: solid 5px #FF3300;

More information

情報資源組織演習B:

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

More information

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

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

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

別 紙 釧 路 公 立 大 学 ホームページリニューアル 業 務 CMS 要 件 一 覧 NO ( 大 分 類 ) NO ( 中 分 類 ) NO ( 小 分 類 ) 3 静 的 HTML 作 成 4 HTMLソース 直 接 編 集 5 CSSソース 直 接 編 集 6 画 像 掲 載 7 アクセシ

別 紙 釧 路 公 立 大 学 ホームページリニューアル 業 務 CMS 要 件 一 覧 NO ( 大 分 類 ) NO ( 中 分 類 ) NO ( 小 分 類 ) 3 静 的 HTML 作 成 4 HTMLソース 直 接 編 集 5 CSSソース 直 接 編 集 6 画 像 掲 載 7 アクセシ 別 紙 釧 路 公 立 大 学 ホームページリニューアル 業 務 CMS 要 件 一 覧 NO ( 大 分 類 ) NO ( 中 分 類 ) NO ( 小 分 類 ) 説 明 利 用 者 組 織 管 理 パスワード 管 理 登 録 修 正 削 除 パスワード 期 限 管 理 組 織 名 組 織 ID 組 織 パスワードを 登 録 修 正 削 除 する 管 理 者 自 身 がパスワードの 設 定 変

More information

HTML文章作成

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

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

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

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

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

More information

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

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

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 3 Webデザイナーに求められる知識 優秀な HTML, CSS, 画像編集, JavaScript, jquery, XML, 色 彩理論, LL, データベース, SEO, SMO, EFO, コピーラ イティング, テキストライティング, イラストレー ション, Flash, ディレクション能力, プロジェクトマ ネジメント, Logo作成, Typography, サーバ管理, PHP, Perl,

More information

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

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

More information

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

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

More information

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

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

More information

スライド 1

スライド 1 株 式 会 社 アジタス コーディングレギュレーション 改 訂 履 歴 初 版 2009/10/01 一 部 修 正 2010/12/06 対 応 ブラウザ 修 正 画 像 ファイルの 形 式 修 正 補 足 追 記 2011/05/02 対 応 ブラウザ 修 正 2013/04/12 文 言 内 容 一 部 修 正 2014/02/25 対 応 メーラーの 追 加 2014/04/08 メールアドレスの

More information

はじめに 本 書 の 目 的 は 制 作 の 効 率 化 クオリティの 向 上 各 作 業 者 間 のスタイルの 統 を 図 る 目 安 になることで 常 にブラッシュアップを 繰 り 返 し 現 時 点 での 最 適 解 の 共 有 に 活 用 するものです 目 次 基 本 仕 様 ファイル ディ

はじめに 本 書 の 目 的 は 制 作 の 効 率 化 クオリティの 向 上 各 作 業 者 間 のスタイルの 統 を 図 る 目 安 になることで 常 にブラッシュアップを 繰 り 返 し 現 時 点 での 最 適 解 の 共 有 に 活 用 するものです 目 次 基 本 仕 様 ファイル ディ 株 式 会 社 クロノドライブ コーディングガイドライン 改 訂 履 歴 2009/10/01 初 版 2010/12/06 一 部 修 正 2011/05/02 対 応 ブラウザ 修 正 画 像 ファイルの 形 式 修 正 補 足 追 記 2013/04/12 対 応 ブラウザ 修 正 2014/02/25 文 言 内 容 一 部 修 正 2014/04/08 対 応 メーラーの 追 加 2014/06/05

More information

Ruby on Railsによる徳島県ホームページ作成システムの開発と今後の展望 ~徳島県CMS「Joruri(ジョールリ)《のオープンソース公開に向けて~

Ruby on Railsによる徳島県ホームページ作成システムの開発と今後の展望  ~徳島県CMS「Joruri(ジョールリ)《のオープンソース公開に向けて~ Joruri プロジェクト 自 治 体 サイト 向 け オープンソースCMS Joruri のご 紹 介 2010 年 11 月 27 日 株 式 会 社 アイ ディ エス サイトブリッジ 株 式 会 社 貴 田 秀 資 自 己 紹 介 貴 田 秀 資 (きだひでし) 株 式 会 社 アイ ディ エス( 徳 島 市 ) 代 表 サイトブリッジ 株 式 会 社 ( 三 鷹 市 ) 代 表 オープンソースCMS

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

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

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

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

html_text

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

More information

スライド 1

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

More information

CSSで書籍組版を

CSSで書籍組版を CSSで 書 籍 組 版 を ( 有 )イー エイド 藤 島 雅 宏 FormatterClub CSS 書 籍 組 版 セミナー 講 演 資 料 開 催 日 2013 年 10 月 18 日 会 場 東 京 都 中 央 区 浜 町 区 民 館 簡 単 そう 易 しい 簡 単 なことしかできない CSSは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

2 2-1 HTMLの 構 造 等 公 開 URLが 静 的 なHTMLであること 判 読 不 可 能 な 文 字 を 含 むものや 文 字 数 が 多 すぎるURL(いわゆる 動 的 なHTML)は 原 則 として 不 可 とする 2-2 任 意 なURLが 使 用 でき コンテンツ 作 成 時

2 2-1 HTMLの 構 造 等 公 開 URLが 静 的 なHTMLであること 判 読 不 可 能 な 文 字 を 含 むものや 文 字 数 が 多 すぎるURL(いわゆる 動 的 なHTML)は 原 則 として 不 可 とする 2-2 任 意 なURLが 使 用 でき コンテンツ 作 成 時 1 1-1 サイト 全 般 デザイン 等 サイト 全 体 が 標 準 化 統 一 化 されたページデザインとすること ただし サイトで 異 なるデザインで 作 成 表 示 することができること 1-2 ヘッダー フッターは 原 則 すべてのページで 統 一 したデザインとすること 1-3 ロゴ イラスト バナーなどサイトに 応 じたデザインで 作 成 すること 1-4 スマートフォンやタブレット 端

More information

Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheet

Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheet 2012 Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheets CSS2 CSS3 Web Web2.0 Web3.0 Web IT Web Homepage

More information

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

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

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

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

1 1 1........................... 1 2.............................. 1 2 2 1........................... 2 2...................... 3 3................... 0448051 1 1 1........................... 1 2.............................. 1 2 2 1........................... 2 2...................... 3 3.................... 4 4........................ 6 5...........................

More information

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

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

More information

情報基礎実習2013第8回テキスト

情報基礎実習2013第8回テキスト 情 報 基 礎 実 習 第 8 回 2014 年 6 月 12 日 ( 木 ) 6 月 13 日 ( 金 ) 担 当 教 員 : 逸 村 裕 高 久 雅 生 TF: 池 田 光 雪 普 段 我 々がアクセスする Web サイトは ほぼ 全 てが 様 々な 言 語 や 技 術 を 併 用 して 運 用 さ れている その 中 でも 最 も 基 礎 的 な 言 語 である Hyper Text Markup

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

1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 高 いフレームレートで 再 生 ができると 一 般 的 に 動 画 は 滑 らかに 動 作 する 試 験 範 囲 : 5-2.マルチメディアと 動 的 表 現 試

1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 高 いフレームレートで 再 生 ができると 一 般 的 に 動 画 は 滑 らかに 動 作 する 試 験 範 囲 : 5-2.マルチメディアと 動 的 表 現 試 ウェブデザイン 技 能 検 定 3 級 学 科 練 習 問 題 本 練 習 問 題 の 著 作 権 は 当 協 会 に 帰 属 します 協 会 の 提 供 する 一 部 又 は 全 ての 練 習 問 題 を 無 断 で 複 写 転 載 営 利 利 用 することを 禁 止 します 内 容 解 答 その 他 一 切 のお 問 い 合 わせは 受 け 付 けておりません 本 練 習 問 題 と 実 際 の

More information

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

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

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

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

◆TOPページデザインを制作する際の注意点 ※別紙(sample_1

◆TOPページデザインを制作する際の注意点 ※別紙(sample_1 2011/4/26 改 定 デザインカンプ 制 作 ガイドライン 別 紙 (sample_1.pdf) 参 照 カンプ 制 作 に 入 る 前 にディレクターと 打 ち 合 わせを 行 い 目 的 に 合 ったトップページデザインを 制 作 すること 1. 著 作 権 について デザインで 使 用 する 写 真 素 材 およびイラスト 素 材 は 弊 社 提 供 の 素 材 集 サイトから 使 用

More information

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

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

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

ホームページ作成技法

ホームページ作成技法 Webページプログラミング Dr. Anna Yamaguchi Course URL: http://www2.obirin.ac.jp/annay/ 1 Dr. Anna Yamaguchi 工 学 博 士 : 東 京 都 立 大 学 大 学 院 ( 現 首 都 大 学 東 京 ) 工 学 研 究 科 電 気 工 学 博 士 号 Internet Packet Loss Recovery Using

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

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

untitled

untitled 25 10 12 11 24 (1) 14 (2) 26 10 44 (3) (4) (5) 27 10 68 (6) (7) (8) 25 10 ( ) (1) (2) (3) ) city.yokohama.lg.jp city.yokohama.jp WEB WEB WEB WEB WEB WEB 1 25 10 WEB WEB (1) (2) (3) (4) 25 10 (1) WEB (2)

More information

ホームページ作成技法

ホームページ作成技法 Webページプログラミング Dr. Anna Yamaguchi Course URL: http://www2.obirin.ac.jp/annay/ 1 Dr. Anna Yamaguchi 工 学 博 士 : 東 京 都 立 大 学 大 学 院 ( 現 首 都 大 学 東 京 ) 工 学 研 究 科 電 気 工 学 博 士 号 Internet Packet Loss Recovery Using

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

HTML5がもたらすWeb の新展望について

HTML5がもたらすWeb の新展望について 技 術 動 向 レポート HTML5がもたらすWebの 新 展 望 について コンサルタント 情 報 通 信 研 究 部 井 上 敬 介 今 日 重 要 なインフラとなっているWebを 支 える 技 術 の1つに HTMLがある 現 在 この HTMLの 最 新 仕 様 であるHTML5の 策 定 が 進 められており 注 目 が 集 まっている 本 稿 では HTML5 の 誕 生 に 至 る 歴

More information

388-356697252-2.pdf

388-356697252-2.pdf 専修大学 ネットワーク情報学部 2012年度 特殊演習 (Webプログラミング) 新居雅行 / Masayuki Nii 2 HTML/CSS 2012 4 23 1 2-1 Web 2 2-1 80 SSL Apache WindowsIIS Internet Information Server HTTP HyperText Transfer Protocol HTML HTML 1 1 [ URI]

More information

第48回 技能五輪全国大会

第48回 技能五輪全国大会 第 50 回 技 能 五 輪 全 国 大 会 ウェブデザイン 職 種 競 技 課 題 The 50th National Skills Competition Web Design Competition Test Project ( 事 前 公 表 ) 2012 年 10 月 9 日 1 1. MODULE 1 課 題 モジュール 1 制 限 時 間 6.5 時 間 ( 競 技 1 2 日 目 )

More information

おすすめページ

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

More information

1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1...............

1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1............... 1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1.............................. 3 2........................... 3 3......................

More information

(Microsoft Word - Mobirth\225\317\212\267\203}\203j\203\205\203A\203\213.doc)

(Microsoft Word - Mobirth\225\317\212\267\203}\203j\203\205\203A\203\213.doc) 1.Mobirth 変 換 ルールの 作 成 について 2011/12/07 1 管 理 画 面 へのログイン 方 法 管 理 画 面 の URL 本 受 注 の 場 合 :https://mobirth.com/site.s/( 該 当 顧 客 変 換 後 URL) 仮 登 録 の 場 合 :https://mbz.jp/site.s/( 該 当 顧 客 変 換 後 URL) ユーザー 名 変 換

More information

エ シラバスの 公 開 サイトはレスポンシブ 対 応 ( 様 々な 種 類 の 機 器 や 画 面 サイズに 単 一 のファイルで 対 応 )しているこ オ 教 員, 職 員 の 利 用 グループを 作 成 し,グループ 毎 に 予 め 設 定 した 権 限 ( 利 用 メニューやマスタメンテナンス

エ シラバスの 公 開 サイトはレスポンシブ 対 応 ( 様 々な 種 類 の 機 器 や 画 面 サイズに 単 一 のファイルで 対 応 )しているこ オ 教 員, 職 員 の 利 用 グループを 作 成 し,グループ 毎 に 予 め 設 定 した 権 限 ( 利 用 メニューやマスタメンテナンス 仕 様 書 件 名 契 約 期 間 契 約 条 件 公 立 大 学 本 学 京 都 市 立 芸 術 大 学 ( 教 務 学 生 課 ) WEBシラバスシステムに 係 るソフトウェアのリース 契 約 締 結 日 から 平 成 32 年 9 月 30 日 1 目 的 京 都 市 立 芸 術 大 学 ( 以 下, 本 学 という )は, 従 来 実 施 していたシラバ ス 冊 子 の 作 成 を 取 り

More information

03 CMS機能審査表.xls

03 CMS機能審査表.xls 厚 真 町 ホームページ 構 築 業 務 CMS 機 能 調 査 表 ( 別 紙 ) 対 応 欄 : 本 業 務 の 委 託 費 用 内 で 対 応 可 能 : 代 替 案 により 本 業 務 の 委 託 費 用 内 で 対 応 可 能 ( 代 替 案 欄 に 代 替 案 をご 記 入 ください ) : 対 応 不 可 項 目 番 号 要 件 対 応 代 替 案 1 1.システム 基 本 要 件 Windows

More information

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

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

More information

untitled

untitled 16 ... 2...2... 3...3... 4... 5...5...8...9...10...12...13...14...15...16...17...19...20...20... 22...22...22... 23...23...24... 25...26...26... 28... 30... 31...31...32...32...37... 38...38 1 World Wide

More information

1

1 目 次 はじめに... 2 音 声 ブラウザの 読 み 上 げ 手 順... 2 音 声 ブラウザへの 具 体 的 な 対 応 方 法... 3 1. 基 本 言 語 3 2.スペースの 挿 入 と 改 行 (タグ)の 挿 入 3 3. 取 り 消 し 線 4 4. 記 号 などの 表 記 4 5. 英 単 語 5 6. 数 字 5 7.イメージマップ 6 8. 表 組 み 6 9.PDF

More information

Microsoft Word - FBE3A91F.doc

Microsoft Word - FBE3A91F.doc 広 島 大 学 ウェブマネジメントシステム 共 通 事 項 (Ver:2009.04.16) 本 システムに 関 する 問 い 合 わせ 本 システムに 関 する 問 い 合 わせは 下 記 までご 連 絡 ください 社 会 連 携 情 報 政 策 室 広 報 グループ 内 線 :5017 5017 6131 E-mail mail:koho@office.hiroshima koho@office.hiroshima-u.ac.jp

More information

産 農 産 物 の 地 産 地 消 の 推 進 と 置 賜 産 農 産 物 の 愛 用 運 動 を 実 施 することにより 置 賜 地 域 における 農 業 の 活 性 化 並 びに 地 域 の 活 性 化 を 図 ることを 目 的 に 平 成 年 度 に 設 立 したものである 設 立 以 降 生

産 農 産 物 の 地 産 地 消 の 推 進 と 置 賜 産 農 産 物 の 愛 用 運 動 を 実 施 することにより 置 賜 地 域 における 農 業 の 活 性 化 並 びに 地 域 の 活 性 化 を 図 ることを 目 的 に 平 成 年 度 に 設 立 したものである 設 立 以 降 生 おきたま 食 の 応 援 団 ウェブサイトの 作 成 及 び 運 用 仕 様 書 委 託 業 務 の 名 称 置 賜 産 農 産 物 愛 用 運 動 推 進 事 業 業 務 委 託 委 託 業 務 の 概 要 () 委 託 業 務 の 目 的 平 成 年 度 に 設 立 した おきたま 食 の 応 援 団 活 動 を 充 実 させるため おき たま 食 の 応 援 団 ウェブサイト( 以 下 本 サイト

More information

目 次 1. 提 案 依 頼 にあたって... 3 1.1. 本 件 の 目 的... 3 2. 岩 手 県 立 大 学 ウェブサイトリニューアルの 概 要... 3 2.1. 概 要... 3 2.2. スケジュールの 目 安... 3 2.3. 契 約 期 間... 3 2.4. 費 用...

目 次 1. 提 案 依 頼 にあたって... 3 1.1. 本 件 の 目 的... 3 2. 岩 手 県 立 大 学 ウェブサイトリニューアルの 概 要... 3 2.1. 概 要... 3 2.2. スケジュールの 目 安... 3 2.3. 契 約 期 間... 3 2.4. 費 用... 公 立 大 学 法 人 岩 手 県 立 大 学 岩 手 県 立 大 学 ウェブサイトリニューアル 業 務 に 係 る 提 案 仕 様 書 1 目 次 1. 提 案 依 頼 にあたって... 3 1.1. 本 件 の 目 的... 3 2. 岩 手 県 立 大 学 ウェブサイトリニューアルの 概 要... 3 2.1. 概 要... 3 2.2. スケジュールの 目 安... 3 2.3. 契 約 期

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-1 IDごとに 編 集 権 限 を 設 け 権 限 に 応 じたメニューが 表 示 されること 3-2 管 理 者 はすべてのページにおいて 編 集 する 権 限 があること 3-3 複 数 のユーザーが 同 時 に 同 一 のページを 更 新 できないこと 基

3.コンテンツの 作 成 機 能 3-1 IDごとに 編 集 権 限 を 設 け 権 限 に 応 じたメニューが 表 示 されること 3-2 管 理 者 はすべてのページにおいて 編 集 する 権 限 があること 3-3 複 数 のユーザーが 同 時 に 同 一 のページを 更 新 できないこと 基 ( 別 紙 ) 志 摩 市 ホームページ 構 築 業 務 CMS 機 能 調 査 表 対 応 欄 : 本 業 務 の 委 託 費 用 内 で 対 応 可 能 : 代 替 案 により 本 業 務 の 委 託 費 用 内 で 対 応 可 能 ( 代 替 案 欄 に 代 替 案 をご 記 入 ください ) : 対 応 不 可 項 目 番 号 要 件 対 応 代 替 案 1-1 1.システム 基 本 要 件

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回

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

More information

ホームページの作成

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

More information

18

18 3.2.1 HTML,CSS 概 要 第 3 部 第 2 章 HTML,CSS 私 達 が 普 段 見 ている Web ページは そのほぼ 全 てが HTML(HyperText Markup Language)と CSS(Cascading Style Sheets)をはじ めとするいくつかの 技 術 の 組 み 合 わせによって 作 られています そして 私 達 でも 簡 単 に Web ページを

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

HTML CSS CSS CSS A LIST APART Fluid Grid Fluid Image Media Queries Fluid Grid Grid Design Fluid Grid 60px 20px 620px 300px 960px 620 960 100 300 960 100 =64.58333% =31.25% 960px 60px 20px 960px 1 =60px

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

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

More information

例 ) B&B Brighton House ( http://www.bbbrightonhouse.com/ ) このサイトは タブ 先 のページごとにヘッダー 部 に 使 用 する 写 真 を 変 化 させている 例 です またこのサイト では トップページには ModifiableWeb i

例 ) B&B Brighton House ( http://www.bbbrightonhouse.com/ ) このサイトは タブ 先 のページごとにヘッダー 部 に 使 用 する 写 真 を 変 化 させている 例 です またこのサイト では トップページには ModifiableWeb i ModifiableWeb レイアウトデザインガイド 1. 基 本 構 成 ModifiableWeb を 使 用 したWebサイトの 基 本 構 成 は 以 下 のようになっています ModifiableWeb iframe の 外 側 の Page Header Page Footer 及 び 全 体 の 背 景 は 普 通 のWebサ イト 同 様 自 由 にデザインすることができます ModifiableWeb

More information

< 目 次 > ネットコモンズ(NetCommons)の 仕 組 み CMS の1つであるネットコモンズ 3 ネットコモンズの 仕 組 み 3 県 立 学 校 間 ネットワークの 仕 組 み 4 参 考 Windows パソコン 上 へのネットコモンズのインストール 5 ネットコモンズ(NetCom

< 目 次 > ネットコモンズ(NetCommons)の 仕 組 み CMS の1つであるネットコモンズ 3 ネットコモンズの 仕 組 み 3 県 立 学 校 間 ネットワークの 仕 組 み 4 参 考 Windows パソコン 上 へのネットコモンズのインストール 5 ネットコモンズ(NetCom 平 成 25 年 度 NetCommons 活 用 研 修 会 グループウェア: 活 用 編 NetCommons 演 習 テキスト 埼 玉 県 立 総 合 教 育 センター < 目 次 > ネットコモンズ(NetCommons)の 仕 組 み CMS の1つであるネットコモンズ 3 ネットコモンズの 仕 組 み 3 県 立 学 校 間 ネットワークの 仕 組 み 4 参 考 Windows パソコン

More information

Microsoft Word - 309DW_END

Microsoft Word - 309DW_END 9.1 Web サイト 作 成 の 手 順 第 9 章 Web サイト 作 成 前 章 ではインターネットの 利 用 について 解 説 してきました Web サイトの 公 開 は 世 界 中 に 情 報 を 発 信 することのできる 手 段 です こ の 章 では いよいよ 自 分 で Web サイトを 作 成 し 公 開 してみましょう 1.Web サイトの 作 成 から 公 開 までの 流 れ

More information

Adobe® Corporate Template 2005

Adobe®  Corporate Template 2005 Dreamweaver CS3 による CSS デザイン 入 門 小 松 学 史 アドビ 認 定 インストラクター(ACI) 1 Who is this guy? 小 松 学 史 アクティブファクター Dreamweaverおよび Flash アドビ 認 定 インストラク ター(ACI) 2000 年 よりフリーランスとして マルチメディアコン テンツ Web サイト 制 作 に 携 わる 現 在

More information

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

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

More information

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

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

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

■新聞記事

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

More information