目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法 テンプレートの 使 用 キャラクタエンコーディング ヘッダーの 書 き 方 画 像 について CSS の 書 き
|
|
|
- こうしょ えいさか
- 1 years ago
- Views:
Transcription
1 Ver.2 ユーザマニュアル スタートガイド 第 2 版 最 終 更 新 日 2011/7/12 1
2 目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法 テンプレートの 使 用 キャラクタエンコーディング ヘッダーの 書 き 方 画 像 について CSS の 書 き 方 フォントサイズの 指 定... 9 第 2 章 コンテンツ 制 作 のポイント テーブルの 装 飾 ブロック 要 素 のフロート...11 (1) (2) (3) アイコンを 使 ったメニューデザイン...11 テキストをつかったメニューデザイン...12 デザインの 出 し 分 け 画 像 の 周 りにテキストを 流 し 込 む iphone 風 のリスト フォームコンポーネント(form の 子 要 素 )の 調 整...15 (1) (2) (3) form input select textarea タグのサイズ 調 整...15 ラジオボタン チェックボックスのサイズ 調 整...16 入 力 モードの 設 定
3 本 書 について 本 書 はラウンドアバウトを 利 用 したコンテンツ 制 作 ガイドです 本 書 では ラウンドアバウトのカスタマイ ズなしでコンテンツを 作 成 する 手 順 を 示 しています ラウンドアバウトの 機 能 をカスタマイズしてより 細 かく 作 りこみたい 方 は 機 能 について 詳 しく 書 かれて いる 別 紙 ラウンドアバウト 2 開 発 リファレンス を 参 照 してください 3
4 改 訂 履 歴 版 数 発 行 日 改 訂 内 容 第 1 版 2011 年 5 月 24 日 初 版 発 行 第 2 版 2011 年 7 月 12 日 第 1 章 1-1 に SoftBank 端 末 の 仕 様 とラウンドアバウト の 動 作 について 追 記 文 書 全 体 の 注 意 補 足 の 文 言 を に 訂 正 第 1 章 1-5 に au 端 末 の CSS 容 量 制 限 について 追 記 タイトルをスタートアップガイドからスタートガイドに 訂 正 4
5 はじめに モバイル 端 末 は 画 面 のピクセル 数 や HTML CSS の 解 釈 など 仕 様 に 違 いがあるので 同 じコンテンツ を 様 々なモバイル 端 末 でみると 画 像 のレイアウトが 崩 れてしまったりフォントの 大 きさがバラバラにな ってしまったりしてしまいます ラウンドアバウトを 通 すと ラウンドアバウトがモバイル 端 末 の 仕 様 の 違 いを 吸 収 してくれるので 下 ( 図 1)のように 同 じようなデザインにすることが 出 来 ます 図 1 ラウンドアバウトありのコンテンツ F-01C T004 N905i iphone このようなラウンドアバウトを 使 ったコンテンツをつくるための 手 順 を 次 の 章 以 降 で 説 明 します 5
6 第 1 章 コンテンツ 制 作 方 法 ラウンドアバウトを 使 ったスマートフォン 基 準 のコンテンツ 制 作 方 法 を 簡 単 に 説 明 します 1-1 テンプレートの 使 用 ラウンドアバウト 2 にはスマートフォンベースを 想 定 したサンプルコンテンツがデフォルトで 提 供 され こ れをテンプレートとしています コンテンツ 制 作 にはこのテンプレートを 使 用 します 初 期 出 荷 状 態 では はじめに で 紹 介 したコンテンツが 入 っています 図 2 テンプレートファイルの 構 成 template/ index.html 1 HTML ファイル css/ style.css style.css.csv 2 スタイルシート index.html HTML 3 CSS 変 換 シート ファイル img/ 第 index.html HTML 一 章 ファイル ファイル 第 二 章 ファイル 1 index.html ラウンドアバウトでのモバイルコンテンツ 制 作 に 必 要 なヘッダー 情 報 が 入 っています (1-3 項 参 照 ) 初 期 出 荷 状 態 では はじめに で 紹 介 したサンプルコンテンツが 入 っています 2 style.css タグのデザインを 初 期 化 するリセット 情 報 と コンテンツ 制 作 をしやすくするためのクラ スが 入 っています スタイルシート 内 は reset, radio,checkbox size などのコメントで 分 かれているの で 各 コメント 内 にどのようなスタイルが 入 っているのか 説 明 します reset デザインを 初 期 化 するためにはいっています reset を 追 加 するときは タイプセレクタ にプロパティを 複 数 書 かないで 1 つずつ 書 くようにします radio,checkbox size ラジオボタンとチェックボックスをタップしやすくするために 入 っているスマ ートフォン 向 けのサイズ 調 整 です 調 整 が 必 要 な 場 合 は 自 由 に 変 更 して 下 さい (2-5 項 参 照 ) smartphone style list iphone 風 の 矢 印 つきリストを 簡 単 に 作 るためのクラスが 用 意 されていま 6
7 す (2-4 項 参 照 ) 調 整 が 必 要 な 場 合 は 自 由 に 変 更 しても 構 いませんが CSS 変 換 シートと 連 動 し ているのでセレクタ 名 は 変 更 しないようにします main コンテンツに 対 してのスタイルを 自 由 にかきます 初 期 出 荷 状 態 では はじめに で 紹 介 したサンプルコンテンツが 入 っています 3 style.css.csv ラウンドアバウトのスタイル 変 換 機 能 である CSS 変 換 シートです CSS ファイルと 連 動 して 動 作 し フォントとラジオボタンとチェックボックス 矢 印 つきリストのサイズ 調 整 が 初 期 出 荷 状 態 で 入 っています CSS 変 換 シートを 使 うことで フォントサイズなどが 端 末 ごとの 最 適 な 大 き さに 調 整 できます [ 参 照 ] CSS 変 換 シートのカスタマイズについて 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレン ス 第 6 章 CSS 変 換 シートを 参 照 してください SoftBank では HTML が 48KB 以 上 になると HTML を 一 切 表 示 することができなくなることから roundabout では 5%の 余 裕 を 残 した 45.6KB の 部 分 でコンテンツを 切 り 取 る 処 理 を 行 っています この 場 合 途 中 で 切 れてしまうので コンテンツを 見 直 して 下 さい 1-2 キャラクタエンコーディング コンテンツは UTF-8 で 作 成 します UTF-8 以 外 でつくる 場 合 はサーバの 設 定 変 更 が 必 要 になります [ 参 照 ] 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 9 章 キャラクタエンコーディング 変 換 を 参 照 してください 1-3 ヘッダの 書 き 方 1-1 項 で 紹 介 したテンプレートの index.html にあるヘッダの 内 容 です VGA をベースとしたコンテンツへ の 対 応 や スマートフォンの 表 示 領 域 設 定 など ラウンドアバウトを 使 ったサイト 制 作 に 必 要 な 設 定 等 が 含 まれています <?xml version="1.0" encoding="utf-8"?> <?ra-page viewport="auto" image-convert="no" g="sp"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset= UTF-8" /> <meta name="disparea" content="vga" /> <title>ここにタイトルを 入 れてください</title> <link rel="stylesheet" type="text/css" href="css/style.css" /> </head> 1 2 7
8 1 スマートフォン 用 のラウンドアバウト 調 整 機 能 で ラウンドアバウトが 自 動 で Viewport を 作 成 します スマートフォン 以 外 では 無 視 されます 2 i モードブラウザ 2.x 端 末 に VGA モードで 表 示 させるために 必 要 です [ 参 照 ] ヘッダ 内 容 について 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 1 章 内 の HTML の 記 述 を 参 照 してください 1-4 画 像 について JPEG GIF 8 ビット PNG 形 式 で 作 成 します JPEG は 容 量 を 気 にして 劣 化 させる 必 要 はありませんので 品 質 100%で 作 成 します GIF は 256 色 の 画 像 は 256 色 でつくったり 16 色 の 画 像 は 16 色 でつくったり スペーサーGIF などの 簡 単 な 画 像 は 1 色 でつくったりと 画 像 に 最 適 な 色 数 で 作 成 します PNG の 8 ビット 以 上 はサポートしていません 幅 480px の 画 面 を 想 定 してデザインします 例 えば 横 幅 いっぱいの 画 像 を 作 りたい 時 は 480px 幅 の 画 像 を 1 枚 用 意 して 横 に 2 つ 画 像 を 並 べた い 場 合 は 240px 幅 の 画 像 を 2 枚 用 意 します 画 像 は 相 対 パスで 書 きます 画 像 ファイルの 指 定 を 絶 対 URLですると 変 換 の 対 象 にならないので 相 対 パスなどで 書 くようにしてく ださい 画 像 に width,height 属 性 をつかった 指 定 はしないで 下 さい ただし 画 面 幅 ぴったりに 表 示 したい 場 合 は width 属 性 で width=100%と 指 定 することを 推 奨 します [ 参 照 ] 画 像 について 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 2 章 画 像 変 換 を 参 照 してく ださい 1-5 CSS の 書 き 方 外 部 CSS ファイルに 記 述 します (テンプレートの style.css ファイル) style 要 素 style 属 性 は 使 規 則 には 対 応 していませんので 複 数 のファイルを 使 う 場 合 は link 要 素 を 使 って 読 み 込 みます 複 数 クラス 名 の 指 定 に 対 応 していない 端 末 があるので class 属 性 の 値 は 1 つにします OK <div class= foo > NG <div class= foo bar > 文 字 色 背 景 色 文 字 サイズを 設 定 する 場 合 は div か span 要 素 に クラス 名 をつけて 指 定 します 8
9 <h1> <span class= h1 > 色 と サ イ ズ を 変 え ま す </span> </h1> <div class= bg > 背 景 色 は 赤 です</div>.h1 { color: #333; font-size: medium; }.bg { background-color : #FF0000; } テキストや 画 像 などのアラインメントを 指 定 する 場 合 は div 要 素 に クラス 名 をつけて 指 定 します <div class= content > このテキストはセンターです </div>.content { color: #DDD; text-align: center; } au の 一 部 端 末 は CSS のファイルサイズが 4KB までという 制 限 があります 制 限 を 超 える 場 合 は CSS ファイルを 出 し 分 けてください [ 参 照 ] 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 7 章 CSS ファイル 切 り 替 えを 参 照 してください 1-6 フォントサイズの 指 定 各 端 末 に 最 適 なフォントサイズがあらかじめ 指 定 されているので(デフォルトは x-large) フォントサ イズを 変 更 したい 箇 所 にだけ font-size プロパティを 指 定 してください font-size プロパティは 端 末 ごとに 最 適 サイズに 調 整 するため CSS 変 換 シートと 連 動 しています CSS 変 換 シートにあらかじめ 設 定 されている font-size プロパティが 使 用 可 能 です 使 用 可 能 な font-size プロパティの 種 類 xx-small x-small small medium large x-large xx-large 80% 100% 120% [ 参 照 ] 端 末 ごとのフォントサイズ 調 整 など デフォルト 状 態 から 変 更 する 際 は CSS 変 換 シートを 編 集 してください( 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 6 章 CSS 変 換 シート) 9
![content { color: #DDD; text-align: center; } au の 一 部 端 末 は CSS のファイルサイズが 4KB までという 制 限 があります 制 限 を 超 える 場 合 は CSS ファイルを 出 し 分 けてください [ 参 照 ] 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 7 章 CSS ファイル 切 り 替 えを 参 照](/docs-images/47/20487264/images/page_9.jpg "してください 1-6 フォントサイズの 指 定 各 端 末 に 最 適 なフォントサイズがあらかじめ 指 定 されているので(デフォルトは x-large) フォントサ イズを 変 更 したい 箇 所 にだけ font-size プロパティを 指 定 してください font-size プロパティは 端 末 ごとに 最 適 サイズに 調 整 するため CSS 変 換 シートと 連 動 しています")
10 第 2 章 コンテンツ 制 作 のポイント モバイルコンテンツを 作 る 際 の 基 本 的 なデザインのポイントについて 書 いてあるので コンテンツを 作 る 際 に 参 考 にして 下 さい 文 中 に HTML やスタイルシートのソースが 数 か 所 出 てきますが 一 部 ソースを 抜 粋 したものになり ます 2-1 テーブルの 装 飾 セルの 色 や 文 字 色 フォントサイズなどの 調 整 は th または td 要 素 のタイプセレクタを 使 います 端 末 ごとに 画 面 解 像 度 が 違 うので セルの 大 きさの 設 定 には % を 使 います docomo の 古 い 機 種 などでは border プロパティが 効 かないので 罫 線 を 表 示 する 場 合 には table 要 素 で border= 1 を 指 定 します 図 3 テーブル 装 飾 の 例 ハイスペックな 端 末 では こ のような 線 の 色 を 変 えたデザ インもできます N905i 932SH 図 3 の HTML ファイル 例 <table border="1" width="95%" cellpadding="0"> <tr><th> </th><th> 月 ~ 金 </th><th> 土 </th><th> 日 </th></tr> <tr><td> 午 前 </td><td> </td><td> </td><td rowspan="2"> </td></tr> <tr><td> 午 後 </td><td> </td><td> </td></tr> </table> 10
11 図 3 の CSS ファイル 例 一 部 プロパティを 省 略 しています th,td { text-align:center font-size:medium; } th { width:25%; border:4px solid #F21E8C; background-color:#6bc6dd; color:#ffffff; } td { border:4px solid #999999; color:#000099; } テーブルの 入 れ 子 はできません 古 い 機 種 では table 要 素 に 対 応 していないものがあります それらも 考 慮 したデザインをする 場 合 テーブルを 使 わないレイアウトを 考 えるか テーブルを 使 うものとそうでないものを 出 し 分 けます [ 参 照 ] 出 し 分 け 方 法 については 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 5 章 表 示 コントロール を 参 照 してください 2-2 ブロック 要 素 のフロート au のすべての 端 末 と docomo の 古 い 端 末 などではブロック 要 素 のフロートができません その 場 合 table または div タグを 使 ったデザインをすると 同 じような 見 た 目 のデザインにできます (1) アイコンを 使 ったメニューデザイン 図 4 アイコンを 使 ったメニューデザイン 例 フ ロ ー トが 使 え な い 端 末 で は 縦 に 並 んでしまいます iphone W61K 11
![うものとそうでないものを 出 し 分 けます [ 参 照 ] 出 し 分 け 方 法 については 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 5 章 表 示 コントロール を 参 照 してください 2-2 ブロック 要 素 のフロート au のすべての 端 末 と docomo の 古 い 端 末 などではブロック 要 素](/docs-images/47/20487264/images/page_11.jpg "のフロートができません その 場 合 table または div タグを 使 ったデザインをすると 同 じような 見 た 目 のデザインにできます (1) アイコンを 使 ったメニューデザイン 図 4 アイコンを 使 ったメニューデザイン 例 フ ロ ー トが 使 え な い 端 末 で は 縦 に 並 んでしまいます iphone")
12 アイコンを 使 ったメニューの 場 合 は table タグを 使 うと 同 じような 見 た 目 のデザインになります 図 5 table タグをつかった 例 図 5 の HTML ファイル 例 <table width="100%"> <tr> <td width="33%"> <a href="#"><img src="img/icon1.gif" />RA1</a> </td> <td width="33%"> <a href="#"><img src="img/icon2.gif" />RA2</a> </td> <td> <a href="#"><img src="img/icon3.gif" />RA3</a> </td> </tr> ~ 中 略 ~ </table> (2) テキストをつかったメニューデザイン 図 6 テキストをつかったメニューデザイン 例 フ ロ ー トが 使 え な い 端 末 で は 縦 に 並 んでしまいます iphone T004 12
13 テキストを 横 に 並 べるメニューの 場 合 は div タグと span タグを 使 うと 同 じような 見 た 目 になります 図 7 div タグと span タグを 使 った 例 図 7 の HTML ファイル 例 <div> <span class="item"><a href="#top"> 主 要 </a></span> <span class="item"><a href="#int"> 国 際 </a></span> ~ 中 略 ~ </div> (3) デザインの 出 し 分 け スマートフォンなどの 上 位 端 末 ではブロック 要 素 をフロートにして au 端 末 や docomo の 古 い 端 末 などブ ロック 要 素 のフロートが 使 えない 端 末 にだけ 違 うデザインを 出 したいという 場 合 ラウンドアバウトの 表 示 コントロール 機 能 を 使 うとコンテンツの 出 し 分 けが 出 来 ます 表 示 コントロールを 使 う 場 合 グループを 定 義 しているファイル(device-group.conf)にブロック 要 素 のフ ロートが 出 来 ないグループを NOFLT という 名 前 で 定 義 しているのでそれを 使 います 出 し 分 け 方 法 の 例 <?ra g="!noflt" line= *?> <ul> <li><a href="#top"> 主 要 </a></li> <li><a href="#int"> 国 際 </a></li> </ul> <?ra break?> ブロック 要 素 のフロートが 使 える 端 末 にはこちらを 表 示 します ブロック 要 素 のフロートが 使 えない 端 末 にはこちらを 表 示 します <?ra g="noflt" line= *?> <div> <span class="item"><a href="#top"> 主 要 </a></span><span class="item"><a href="#int"> 国 際 </a></span> </div> <?ra break?> 13
14 [ 参 照 ] device-group.conf ついて 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 4 章 端 末 グル ープを 参 照 してください [ 参 照 ] 表 示 コントロールについて 詳 しくは 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 5 章 表 示 コン トロールを 参 照 してください 2-3 画 像 の 周 りにテキストを 流 し 込 む 図 8 T004 で 表 示 したテキスト 流 し 込 みの 例 画 像 の 周 りにテキストを 流 し 込 むには float プロパティと align 属 性 を 併 用 します float が 使 えない 端 末 でも 画 像 の 周 りにテキストを 流 し 込 む 場 合 には align 属 性 を 指 定 することで 同 じように 見 せることがで きます 図 8 の HTML ファイル 例 <img class= pict01 align= left src= photo.jpg /> 流 し 込 まれるテキスト 図 8 の CSS ファイル 例.pict01 { float:left;} class 属 性 は img 要 素 に 指 定 し CSS には.クラス 名 の 形 でクラスセレクタを 使 います float プロパティの 効 かない au 用 に align 属 性 を 指 定 します 2-4 iphone 風 のリスト 矢 印 つきの iphone 風 リストを 使 う 場 合 テンプレートに arrow という 専 用 クラスが 用 意 されているので それを 使 います 矢 印 つきにしたい li タグに arrow クラスを 指 定 してください 14
15 HTML ファイル 例 <ul> <li class="arrow"><a href="a.html">ラウンドアバウトの 特 徴 </a></li> <li class="arrow"><a href="a.html"><span class="font1">2011 年 5 月 末 発 売 予 定 </span><br />ラウンドア バウト 2.0!よりリッチに 使 いやすく</a></li> </ul> テンプレートの CSS 変 換 シートに 調 整 された 設 定 が 入 っているので 以 下 のようにモバイル 端 末 で 統 一 されたデザインになります 図 9 iphone 風 リストの 表 示 のされ 方 iphone 932SH docomo の 900 シリーズ などではスタイルに 制 限 があるので シンプ ルなリストデザインにな ります T004 N905i 2-5 フォームコンポーネント(form の 子 要 素 )の 調 整 (1) form input select textarea タグのサイズ 調 整 select タグを 使 ったフォームのサイズと input,textarea タグ 内 の 文 字 サイズの 変 更 は font-size プロパテ ィで 調 整 します input タグと textarea タグの 入 力 エリアのサイズは width height プロパティで 調 整 しま 15
16 す font-size プロパティは 端 末 ごとに 調 整 されますが width height プロパティは 調 整 されません [ 参 照 ] 端 末 ごとに width height プロパティを 調 整 したい 場 合 は CSS 変 換 シートを 編 集 して 下 さい( 別 紙 ラウンドアバウト 2 開 発 リファレンス 第 6 章 CSS 変 換 シート) CSS ファイル 例 input {width:95% ;font-size:large;} select {font-size:large;} textarea {width:95%;height:5em;font-size:large;} 図 10 フォームコンポーネントの 表 示 のされ 方 iphone 932SH T004 N905i ドコモ 900 シリーズでは input タグや textarea タグに 対 しての width,height が 効 きません サイズ 調 整 が 必 要 な 場 合 input タグは size 属 性 textarea タグは cols( 横 幅 )と rows( 縦 幅 ) 属 性 の 値 が 有 効 にな ります (2) ラジオボタン チェックボックスのサイズ 調 整 iphone ではラジオボタンとチェックボックスのサイズが 小 さいとタップしにくいことがあります そのため テンプレートには 以 下 のようなボタンサイズを 変 える 設 定 が 入 っています input[type="radio"] {height:30px; width:30px;} input[type="checkbox"] {height:30px;width:30px;} android 端 末 には 効 きません 16
17 (3) 入 力 モードの 設 定 携 帯 の 文 字 入 力 モードの 指 定 には istyle を 使 います istyle=1( 全 角 かな) istyle=2( 全 角 カナ) istyle=3( 半 角 英 字 ( 小 文 字 )) istyle=4( 数 字 ) スマートフォンには 効 きません 17
目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法... 6 1-1 テンプレートの 使 用... 6 1-2 キャラクタエンコーディング... 7 1-3 ヘッダの 書 き 方... 7 1-4 画 像 について... 8 1-5 CSS の 書 き 方
Ver.2 ユーザマニュアル スタートガイド 第 5 版 最 終 更 新 日 2012/7/11 1 目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法... 6 1-1 テンプレートの 使 用... 6 1-2 キャラクタエンコーディング... 7 1-3 ヘッダの 書 き 方... 7 1-4 画 像 について... 8 1-5 CSS の 書 き 方...
CSSの基礎
Webページの 見 た 目 を 定 義 する 視 覚 のための 言 語 CSS ファイル 視 覚 表 現 関 連 付 ける HTML ファイル 論 理 構 造 CSSの 基 礎 CSSの 記 述 方 法 基 本 的 な 形 セレクタ{ プロパティ1: 値 ; プロパティ2: 値 ; セレクタの 種 類 タイプセレクタ CSSの 記 述 HTML CSSを 適 用 する 箇 所 CSSを 記 述 する
Microsoft PowerPoint - 08回目.pptx
1 コンピュータリテラシーII ( 樋 口 担 当 ) 4 回 目 10/17 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I.スタイルシート II.レイアウト III. 課 題 3 I.スタイルシート 1.スタイルシート 4 スタイルシート: 文 書 のスタイルの 設 定 が 書 かれているデータ CSS:スタイルシートの 書 き 方 ( 言 語 )の 一 つ Cascading
■新聞記事
情 報 処 理 C (P.1) 情 報 処 理 C (2016 年 度 ) ホームページ 作 成 入 門 テキストエディタ(メモ 帳 TeraPad など)でHTMLファイルを 作 成 する HTML(Hyper Text Markup Language ) ホームページを 記 述 するための 言 語 のこと テキストエディタの 起 動 (TeraPad の 場 合 ) [スタート]-[プログラム]-[テキストエディタ]-[TeraPad]
ホームページ制作スターターズ
HTML タグ はじめての 方 ガイド Ver1.0 1 < 目 次 > 1ホームページ 構 造 2HTML タグ 3スタイルシート Copyright ナレッジコーディネーター All Rights Reserved. 2 第 1 章 ホームページ 構 造 Copyright ナレッジコーディネーター All Rights Reserved. 3 1HTMLとは ウェブ 上 の 文 書 を 記 述
WORD 98 入力の手引き
コンピュータ 基 礎 実 習 ( 上 級 ) 第 13 週 スタイルシートの 基 礎 今 回 の 授 業 は スタイルシート(CSS)の 使 い 方 を 解 説 します 1. CSS の 基 本 1.1. CSS とは CSS は Cascading Style Sheets の 略 で ウェブページの 見 栄 えを 設 定 するための 言 語 です CSS は 最 近 多 くのサイトで 使 用 され
第3回HP講習会資料ver1.2(2007.9.20)
1.はじめに 第 3 回 技 術 センター 職 員 向 けHP 講 習 会 では スタイルシートの 基 礎 として CSSを 使 った Webページを 作 成 していきます HTMLだけでは 出 来 ないCSSを 用 いたレイアウトを 分 かり 易 く 体 験 してもらえるように 今 回 はCSSの 中 でもクラスやIDといった 概 念 を 省 いています 2.スタイルシートとは? スタイルシート
HTML は 本 来 文 書 の 構 造 を 定 義 文 書 の 見 栄 えはスタイルシートで 記 述 HTML HyperText Markup Language 出 典 : フリー 百 科 事 典 ウィキペディア(Wikipedia) HyperText Markup Language(ハイパー
Web ページ 作 成 2011/ 5/31 Web ページとは IT 用 語 事 典 e-words より Web ページ web page 読 み 方 : ウェブページ WWW システムを 使 ってインターネット 上 で 公 開 されている 文 書 Web ブラウザに 一 度 に 表 示 されるデータのまとまりで テキストデータや HTML によるレイアウト 情 報 文 書 中 に 埋 め 込
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
PowerPoint プレゼンテーション
ホームページの 基 礎 IPアドレス インターネットへの 接 続 に 必 要 なネットワーク 上 のアドレス こ のアドレスは0から255までの4 組 に 数 字 で 表 されます ( 例 192.168.1.1) URL IPアドレスはホームページの 場 所 を 示 す 住 所 です たとえば 220.133.0.1に 接 続 しようとして ブラウザーのURLに 220.133.0.1と 入 れればいいのですが
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
文 書 構 造 とスタイル
第 4 回 の 内 容 文 書 構 造 とスタイル CSSの 基 礎 図 表 の 利 用 文 書 構 造 とスタイル 自 己 紹 介 のHTML 文 書 放 送 太 郎 の 自 己 紹 介
第9回
第 9 回 2016 年 7 月 16 日 情 報 教 育 演 習 II 第 9 回 (1) CSS(4) (1) 今 回 の 課 題 (2) リストの 記 号 や 番 号 の 設 定 (2) クラスの 利 用 (2) クラスとは (2) クラスを 使 った 設 定 (3) CSSファイルでの 設 定 (3) HTMLファイルでの 利 用 (3) クラスの 利 用 例 (1) (3) クラスの 利
html_text
HTML の 基 礎 2015.12.15 1. HTML ファイルの 構 成 1.1. HTML とは? Web ブラウザでホームページを 表 示 するためには,HTML(Hyper Text Markup Language)と 呼 ぶ 言 語 で 記 述 す る 必 要 が あ り ま す.HTML 形 式 のファイルは < と > で 囲 んだ 予 約 語 (タグ)を 含 むテキストファイルで,Web
クリック クリック リンクを 張 るためのタグ タグ ~ リンク 先 のURLやファイル 名 に 対 してリンクを 張 る 同 じフォルダ 内 のファイルにリンク フォルダ 内 のファイルに
Webプログラミング プログラミング1 HTML+CSS (5) (2 章 ) 2013/5/22( 水 ) 演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください 演 習 名 使 用 するフォルダ 演 習 1 Z: Webプログラミング1 20130522
練 習 問 題 1. dataフォルダのq1フォルダ 内 のindex.htmlでブラウザで 正 しく 表 示 できない 状 態 にあ る 画 像 を 正 常 に 表 示 できるようにソースを 修 正 しなさい 修 正 したindex.htmlファイルなどは デスクトップのwdフォルダ 内 にt1と
ウェブデザイン 技 能 検 定 3 級 実 技 練 習 問 題 本 練 習 問 題 の 著 作 権 は 当 協 会 に 帰 属 します 協 会 の 提 供 する 一 部 又 は 全 ての 練 習 問 題 を 無 断 で 複 写 転 載 営 利 利 用 することを 禁 止 します 内 容 解 答 その 他 一 切 のお 問 い 合 わせは 受 け 付 けておりません 本 練 習 問 題 と 実 際 の
ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でカートにアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2
レンタルショッピングカートマニュアル ~ デザイン 設 定 編 ~ ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でカートにアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 ファイル 管 理 ファイルのアップロード/ダウンロード デザイン 設 定 >> ファイル
スタイルシートでデザインを整えよう
スタイルシートでデザイン(2) CSS (Cascading Style Sheets) ここまで HTML は 文 章 の 意 味 的 な 役 割 を 記 述 するもので 表 示 はブラウザ 次 第 であること を 強 調 してきました あるブラウザでの 表 示 方 法 を 前 提 に HTML で 見 た 目 を 制 御 しようとす ると 他 の 環 境 では 意 味 が 通 じにくい 相 互
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
あいち電子自治体ガイドライン（第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
GMO MobileHomePage
テンプレート 解 説 書 (キャンペーンサイト) Last update 2010/02/26 1 目 次 1. テンプレート 解 説 書 (キャンペーンサイト)について...3 2. テンプレートを 利 用 した 携 帯 サイト 制 作 方 法...4 3. 全 ページ 共 通 画 像 について...5 4. トップページ 解 説...7 5. 問 題 ページ 解 説...8 6. 正 解 ページ
コンピュータサイエンス 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 /
ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2
レンタルショッピングカートマニュアル Vol.2 ~ デザイン 設 定 編 ~ ファイル 管 理 ツール デザイン 設 定 >> ファイル 管 理 でアップロードされているファイルを 管 理 できます この 画 面 ではファイルの 確 認 / 移 動 / 削 除 が 可 能 です ファイルのアップロードはできません 2 ファイル 管 理 ファイルのアップロード/ダウンロード デザイン 設 定 >>
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...........................
HTML5&CSS3 レッスンブック
STEP 7-6 Chapter 7 FINISHING & ARRANGE style.css STEP 7-6 で 置 き 換 えた style.css の 設 定 です DESIGN POINTS デザインのポイント Google Fontsの Bowlby One で 表 示 ナビゲーションメニューの 各 リンクは 四 角 形 にデザイン コンテンツは 罫 線 で 囲 まない メインコンテンツの
Microsoft PowerPoint - InfPro_I9.pptx
今 日 の 学 習 内 容 エディタ(emacs)を 使 った 基 本 的 なHTML の 書 き 方 Webページの 公 開 HTMLの 基 礎 知 識 HTML(Hyper Text Markup Language)は Webページを 作 るための 必 要 な 記 述 言 語 HTMLにおける 指 定 の 内 容 は: 1. 文 章 (テキスト)に 対 する 役 割 2. 文 章 やイメージなどのページ
経営論集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
ホームページの仕組み
見 やすいホームページを 作 ろう! 跡 見 学 園 女 子 大 学 公 開 講 座 文 学 部 准 教 授 福 田 博 同 平 成 23 年 5 月 7 日 14 日 目 次 5 月 7 日 1. ショートカットキー 2. HTMLの 仕 組 み 3. XHTMLとCSS 4. W3C 標 準 5. 見 本 に 書 き 込 む 6. 単 語 登 録 5 月 14 日 1. ブログを 試 そう 2.
Microsoft Word - メディア技術基礎.docx
メディア 技 術 基 礎 (Web) 脇 田 玲 先 生 (2010) 田 中 浩 也 (2011) HTML の 基 本 的 な 書 き 方 テキストエディタで index.html を 作 成 して 以 下 のサンプルを 入 力 してみましょう 始 めの 2 行 は HTML を 書 く 前 のおまじないの 様 なものです ここで 登 場 する HTML タグについての 説 明 は 以 下 の
1
目 次 はじめに... 2 音 声 ブラウザの 読 み 上 げ 手 順... 2 音 声 ブラウザへの 具 体 的 な 対 応 方 法... 3 1. 基 本 言 語 3 2.スペースの 挿 入 と 改 行 (タグ)の 挿 入 3 3. 取 り 消 し 線 4 4. 記 号 などの 表 記 4 5. 英 単 語 5 6. 数 字 5 7.イメージマップ 6 8. 表 組 み 6 9.PDF
スライド 1
株 式 会 社 アジタス コーディングレギュレーション 改 訂 履 歴 初 版 2009/10/01 一 部 修 正 2010/12/06 対 応 ブラウザ 修 正 画 像 ファイルの 形 式 修 正 補 足 追 記 2011/05/02 対 応 ブラウザ 修 正 2013/04/12 文 言 内 容 一 部 修 正 2014/02/25 対 応 メーラーの 追 加 2014/04/08 メールアドレスの
本 資 料 では アメブロのヘッダー 画 像 とメニューバーの 設 定 をご 自 身 で 行 っていただくた めのものです < 目 次 > 1. ヘッダー 画 像 の 設 定 方 法 1-1: 自 分 の 指 定 した 画 像 をヘッダー 画 像 に 設 定 方 法 1-2: 自 分 で 簡 単 な
アメブロ ~ヘッダー 画 像 メニューバーの 設 定 方 法 ~ 本 資 料 では アメブロのヘッダー 画 像 とメニューバーの 設 定 をご 自 身 で 行 っていただくた めのものです < 目 次 > 1. ヘッダー 画 像 の 設 定 方 法 1-1: 自 分 の 指 定 した 画 像 をヘッダー 画 像 に 設 定 方 法 1-2: 自 分 で 簡 単 なヘッダー 画 像 を 作 成 する
はじめに 本 書 の 目 的 は 制 作 の 効 率 化 クオリティの 向 上 各 作 業 者 間 のスタイルの 統 を 図 る 目 安 になることで 常 にブラッシュアップを 繰 り 返 し 現 時 点 での 最 適 解 の 共 有 に 活 用 するものです 目 次 基 本 仕 様 ファイル ディ
株 式 会 社 クロノドライブ コーディングガイドライン 改 訂 履 歴 2009/10/01 初 版 2010/12/06 一 部 修 正 2011/05/02 対 応 ブラウザ 修 正 画 像 ファイルの 形 式 修 正 補 足 追 記 2013/04/12 対 応 ブラウザ 修 正 2014/02/25 文 言 内 容 一 部 修 正 2014/04/08 対 応 メーラーの 追 加 2014/06/05
Microsoft PowerPoint - 第03回目.pptx
1 情 報 リテラシーII ( 樋 口 担 当 ) 3 回 目 10/10 本 日 の 予 定 2 Webページの 作 成 I.テキストの 記 述 方 法 II.ハイパーリンク III.インラインイメージ( 画 像 ) IV. 表 V. 課 題 3 I.テキストの 記 述 方 法 1. 改 行 4 終 了 タグは 無 い 改 行 していない なすび なすびがいっぱい
（１）
第 回 アビリンピック 京 都 大 会 ホームページ 部 門 練 習 問 題 (1) 仕 様 1 ホームページの 内 容 府 立 京 都 高 等 技 術 専 門 校 のホームページを 作 成 する 2 ページ 構 成 とファイル index.html guid.html course.html mystyle.css ie.css 以 上 のファイルと 素 材 はホームページよりダウンロードして
<4D6963726F736F667420506F776572506F696E74202D2053454F82CC92B48AEE9162819591CE8DF4837D836A83858341838B2E707074>
2 3 4 5 6 http://jprs.co.jp/ 7 8 9 10 11 https://adwords.google.co.jp/select/keywordtoolexternal 12 13 14 http://www.pythagoras.bz/ Pythagoras 15 16 17 18 19 20
Microsoft Word - chap2.doc
第 2 章 ホームページとHTML(タグ) ここでは HTML タグについて 今 まで 使 う 機 会 が 無 かった 学 生 を 対 象 に 説 明 する 既 に HTML タグを 使 ったことのある 学 生 にとっては 知 っている 話 になると 思 うので ざっと 目 を 通 すだけでよいだろう 初 めての 学 生 は 演 習 等 を 通 じて 使 い 慣 れて 欲 しい [1] HTML 通
(Microsoft Word - \203u\203\215\203O\215\354\220\254.doc)
ブログをカスタマイズ! ~HTML HTML CSS を 使 ってブログを 自 分 の 好 みにしちゃおう ~ ブログを 登 録 しよう! ブログってなんだろう? ブログとはインターネット 上 で 管 理 者 が 記 事 を 投 稿 する 私 的 ニュースサイト あるいは 日 記 的 なもののこと 個 人 のホームページを 持 たなくても 簡 単 に 自 分 が 書 きたいことを 作 って 載 せることができる
例 ) B&B Brighton House ( http://www.bbbrightonhouse.com/ ) このサイトは タブ 先 のページごとにヘッダー 部 に 使 用 する 写 真 を 変 化 させている 例 です またこのサイト では トップページには ModifiableWeb i
ModifiableWeb レイアウトデザインガイド 1. 基 本 構 成 ModifiableWeb を 使 用 したWebサイトの 基 本 構 成 は 以 下 のようになっています ModifiableWeb iframe の 外 側 の Page Header Page Footer 及 び 全 体 の 背 景 は 普 通 のWebサ イト 同 様 自 由 にデザインすることができます ModifiableWeb
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)
1. 目 次 1. 目 次 2.はじめに 2-1.メールテンプレート 編 集 機 能 とは? 2-2. 対 象 読 者 3. 用 語 一 覧 4. 利 用 の 流 れ 4-1.メールテンプレート 編 集 の 流 れ 5. 機 能 説 明 利 用 方 法 5-1.テキストメール 編 集 開 封 率 を
メールテンプレート 編 集 ユーザーマニュアル Ver1.0 2016/5/1 株 式 会 社 シャノン 1 1. 目 次 1. 目 次 2.はじめに 2-1.メールテンプレート 編 集 機 能 とは? 2-2. 対 象 読 者 3. 用 語 一 覧 4. 利 用 の 流 れ 4-1.メールテンプレート 編 集 の 流 れ 5. 機 能 説 明 利 用 方 法 5-1.テキストメール 編 集 開 封
2. 画 面 の 分 割 タグを 使 用 することにより 1 つの 画 面 を 縦 横 複 数 に 分 割 することがでる 分 割 されたそれぞれ の 画 面 をフレームと 呼 ぶ 例 えば 目 次 を 常 に 画 面 上 の 決 まったフレームに 固 定 して 表 示 し 目 次 項
Web ページ 画 面 構 成 の 技 法 1. 配 置 の 制 御 基 本 的 なタグの 使 い 方 については はじめての HTML などを 通 して 学 習 した ここでは もう 少 し 凝 っ た 画 面 構 成 を 行 うための 基 礎 技 法 について 解 説 する 文 字 や 図 などを 画 面 上 の 任 意 の 位 置 に 配 置 するため には タグを 用 いた 表
Microsoft PowerPoint - css.ppt [互換モード]
![Microsoft PowerPoint - css.ppt [互換モード]](/thumbs/41/22472741.jpg "Microsoft PowerPoint - css.ppt [互換モード]")
情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 W3Cで 推 奨 される
確 認 とアップロード (2) ブラウザを 使 用 して 確 認 内 容 の 修 正 ブラウザでファイルを 開 き 表 示 されるページを 確 認 エディタで 修 正 し 上 書 保 存 した 後 再 読 込 み( 更 新 ) ボタン 上 記 作 業 を 繰 り 返 す (3) 完 成 したファイル
Webによる 情 報 提 供 リクエスト Webサーバ レスポンス ブラウザ 宮 原 のホームページ
HTML+CSS_Lesson03_2s.indd
Windows ファイル 名 には 半 角 スペースも 使 用 しないよう 注 意 しましょう 1. _- 2 類 似 するコンテンツがある 際 に content001 content002 といった 連 続 するナンバリングでフォ ルダ 名 をつけることがあります この 方 法 だと 途 中 のコンテンツがなくなったり ネーミングのルールに 無 理 が 生 じたときに ファイル やフォルダを 管
8 Web 8.1 Web Web 8.3 XHTML Web (1) (2) 2 8.1.1 Web Web Web Web 4 Web Web 2 5 PC Web Microsoft Internet Explorer Netscape Navigator Mozilla Firefox We
8 Web Web XHTML XHTML 1 Web Web 1 Web XHTML Web Web XHTML XHTML Extensible HyperText Markup Language( ) Web HTML XML HTML Web 2 XHTML XHTML HTML 4.01 XHTML XHTML 1.0 3 XHTML XHTML XHTML Web 1 2 Netscape
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
目 次 第 1 章 開 発 フロー... 4 第 2 章 要 件 定 義... 5 (1) 概 要... 5 (2) 変 換 による 制 約... 5 (3) デバイスによる 制 約... 6 (4) 端 末 の 保 証 についての 考 え 方... 6 (5) デザイン... 7 (6) デザイン
ジーンコード 設 計 要 件 定 義 ガイド 第 1 版 最 終 更 新 日 2016/03/31 目 次 第 1 章 開 発 フロー... 4 第 2 章 要 件 定 義... 5 (1) 概 要... 5 (2) 変 換 による 制 約... 5 (3) デバイスによる 制 約... 6 (4) 端 末 の 保 証 についての 考 え 方... 6 (5) デザイン... 7 (6) デザインコンポーネントで
1/2
札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト (2) 1 札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト HTMLの 基 礎 知 識 (2) 1 画 像 の 表 示 HPに 画 像 を 表 示 させてみる まず HTML 文 書 と 同 じフォルダ 内 にJPEGファイル( 拡 張 子.jpg )を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......................
Microsoft Word - CMS操作説明会資料.docx
平 成 25 年 6 月 24 日 株 式 会 社 ネクストワン 1 今 回 の 操 作 説 明 会 では 次 のようなサンプル 記 事 を 作 成 してみたいと 思 います 2 管 理 画 面 にログインする 1. 九 重 町 役 場 ホームページにアクセスします 2.アドレスバーのホームページ URL の 後 ろに admin と 入 力 します http://www.town.kokonoe.oita.jp/admin/index.php
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:
項 目 設 定 設 置 可 能 項 目 数 100 項 目 投 票 フォームの 設 置 可 能 投 票 項 目 数 1 項 目 (10 選 択 肢 ) 必 須 項 目 設 定 条 件 項 目 設 定 添 付 ファイル 合 計 容 量 入 力 項 目 を 必 須 項 目 に 設 定 できます フォーム
更 新 日 :2015 年 4 月 14 日 料 金 初 期 費 用 月 額 料 金 無 料 サーバーの 初 期 セットアップ 時 以 外 または 複 数 フォームメーラーを インストールする 場 合 には 別 途 費 用 が 必 要 となります 無 料 スペック 100 個 作 成 可 能 フォーム 数 一 般 投 票 注 文 フォームに 対 応 設 置 可 能 項 目 数 100 項 目 添 付
変 更 履 歴 2012-03-29 バージョン 1.17 [6-2. CSS パースエラー 時 の 対 応 ]の 記 述 を 変 更 2012-03-12 バージョン 1.16 [4. 出 力 切 替 機 能 ]に 注 意 点 を 追 記 2011-11-11 バージョン 1.15 [4. 出 力
![変 更 履 歴 2012-03-29 バージョン 1.17 [6-2. CSS パースエラー 時 の 対 応 ]の 記 述 を 変 更 2012-03-12 バージョン 1.16 [4. 出 力 切 替 機 能 ]に 注 意 点 を 追 記 2011-11-11 バージョン 1.15 [4. 出 力](/thumbs/40/20522475.jpg "変 更 履 歴 2012-03-29 バージョン 1.17 [6-2. CSS パースエラー 時 の 対 応 ]の 記 述 を 変 更 2012-03-12 バージョン 1.16 [4. 出 力 切 替 機 能 ]に 注 意 点 を 追 記 2011-11-11 バージョン 1.15 [4. 出 力")
ユーザーズ マニュアル Ver1.17 ノイアンドコンピューティング 株 式 会 社 変 更 履 歴 2012-03-29 バージョン 1.17 [6-2. CSS パースエラー 時 の 対 応 ]の 記 述 を 変 更 2012-03-12 バージョン 1.16 [4. 出 力 切 替 機 能 ]に 注 意 点 を 追 記 2011-11-11 バージョン 1.15
22. 情 報 の 発 信 伝 達 コミュニケーション Ustream :2007 年 にジョン ハム ブラッド ハンスタブル ジュラ フェヘルに よって 設 立 された 動 画 共 有 サービス 元 々は3 人 が 開 発 した イラク 戦 争 に 派 兵 された 友 人 達 と 家 族 のための
2016 年 度 春 学 期 ( 月 V/ 火 II ) 情 報 情 報 発 信 と 伝 達 22. 情 報 の 発 信 伝 達 コミュニケーション 23. 情 報 発 信 のためのHTMLの 基 礎 最 初 に 講 義 資 料 は http://astro.u-gakugei.ac.jp/~nishiura 西 浦 クンの 講 義 室 に 縮 小 版 (PDFファイル)を 置 く 予 定 東 京
Microsoft PowerPoint - css [互換モード]
![Microsoft PowerPoint - css [互換モード]](/thumbs/39/20119160.jpg "Microsoft PowerPoint - css [互換モード]")
情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく 使
モール管理者マニュアル 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 編 集 ツール...
ホームページの仕組み
分 かりやすいホームページを 作 ろう! 跡 見 学 園 女 子 大 学 公 開 講 座 文 学 部 准 教 授 福 田 博 同 平 成 24 年 4 月 28 日 5 月 12 日 目 次 4 月 28 日 1. ショートカットキー 2. ブログ 等 を 試 そう 3. ホームページの 仕 組 み 4. XHTMLとCSS 5. W3C 標 準 6. 単 語 登 録 5 月 12 日 1. 見 本
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
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.........................
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
第7章 Webページによる情報の発信
筑 波 大 学 情 報 処 理 実 習 Webページによる 情 報 の 発 信 情 報 処 理 実 習 用 手 引 き P.197~226 World Wide Web (WWW) インターネット 上 のハイパーテキストシステム 1989 年 にCERNの 物 理 学 者 Tim Berners-Leeが 発 明 WWWはインターネットとも 呼 ばれるが, 両 者 は 同 義 語 ではない WebページのアドレスURL
演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z: W
Webデータ 管 理 HTML+CSS (4) (2 章 ) 2011/10/26( 水 ) 1/21 演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z:
/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます " 出 し"の 部 分 をクリックすると"コンテンツですよ "の 字 が 表 されます もう 度 " 出 し"をクリックすると"コンテンツですよ "の 字 が 非 表 になります 折 りたたみパネルの 基
/ 0/0/ : [CSS] 折 りたたみ 可 能 なパネルの 作 成 - CSSのみを 利 した 折 りたたみ 領 域 / アコー ディオンパネル このページのタグ:[CSS] [アコーディオンパネル] 新 着 記 事 覧 タグ 覧 トップページ ipentec.com CSSのみを 利 した 折 りたたみ 可 能 なパネル( 折 りたたみ 可 能 領 域 )を 実 現 するコードを 紹 介 します
スタイルシートを 用 いた Web ページの 運 用 静 岡 大 学 工 学 部 技 術 部 太 田 諭 之, 大 橋 和 義, 後 藤 克 嘉, 水 野 保 則 tsoota@ipc.shizuoka.ac.jp 1.はじめに 静 岡 大 学 工 学 部 技 術 部 のホームページは 2008 年
Departmental Bulletin Paper / 紀 要 論 文 スタイルシートを 用 いたWebページの 運 用 太 田, 諭 之 ; 大 橋, 和 義 ; 後 藤, 克 嘉 ; 水 野, 保 則 技 術 職 員 による 技 術 報 告 集. 2009, 17, p. 24-27. http://hdl.handle.net/10076/10274 スタイルシートを 用 いた Web ページの
PowerPoint プレゼンテーション
1 山 都 町 移 住 定 住 サイト マイホームページ 操 作 説 明 書 平 成 26 年 3 月 10 日 2 会 員 登 録 からホームページ 公 開 まで 会 員 仮 登 録 本 登 録 申 請 ログイン センター 承 認 ホームページ 公 開 センター 承 認 公 開 申 請 ホームページ 作 成 ホームページ 作 成 の4つのステップ 1 ホームページの 設 定 (p4) 2 レイアウト
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]
第5回
情 報 教 育 演 習 II 第 5 回 HTML(4) 前 回 に 引 き 続 き Webの 中 心 的 な 技 術 HTML について 実 習 をします 今 回 で HTMLのまとめ になります HTML(4) 1. 水 平 線 をつくる( 復 習 ) 2.イメージを 貼 り 付 ける 今 回 の 課 題 1.HTMLファイルを 作 成 する 2.HTMLファイルの 文 法 をチェックする -
PowerPoint プレゼンテーション
HTMLガイダンス 1 HTMLを 用 いたUI 設 定 2 色 々な 見 え 方 で 画 面 に 表 示 されるWebページ 全 て 文 字 /キャラクタで 表 現 されたデータの 集 まり HTML(Hyper Text Markup Language) パソコン 等 のインターネット 端 末 のブラウザソフトで 文 書 情 報 を 表 示 するときに 用 いられるプログラム 言 語 の 一 種
ホームページの作成
HTML5,CSS 資 料 HTML5 HTML の 文 法 HTML(Hyper Text Markup Language)は, 文 章 の 部 分 を Tag(タグ)と 呼 ばれ る 命 令 で 挟 んでいく タグは ... 開 始 終 了 のように 開 始 タグと 終 了 タグ 一 対 のペアになっている. タグは, 挟 まれた 部 分 がどのような 情 報 であるかを
第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C
1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 HTML5 では タグの 省 略 は 一 切 認 められていない 第 2 問 インターネット 上 のすべてのコンピュータは イーサネットで 繋 がっている 第 3 問 新 規 にウェブサイトを 公 開 する 際 は HTML ドキュメントをアップロードした 後 に
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
PowerPoint プレゼンテーション
スマートフォン 向 けサイトを 変 換 して 携 帯 でも 表 示 させるASP/SaaSサービス roundabout cloud ラウンドアバウト クラウド Last update 2012.02.28 What is roundabout cloud? ラウンドアバウト クラウドとは? スマートフォン 対 応 が 今 すぐ 始 められるASP/SaaSサービス スマートフォン 向 けのサイト1つで
2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正
1 情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく
PowerPoint プレゼンテーション
1 ましき はぴまるサイト マイホームページ 操 作 説 明 書 平 成 27 年 12 月 2 会 員 登 録 からホームページ 公 開 まで 会 員 仮 登 録 本 登 録 申 請 ログイン センター 承 認 ホームページ 公 開 ホームページ 作 成 ホームページ 作 成 の4つのステップ 1 ホームページの 設 定 (p4) 2 レイアウト デザインの 設 定 (p5) 3 記 事 の 登
Peace & Piece 画面設計書
ホームページ 仕 様 書 株 式 会 社 目 次 1. 更 新 履 歴 2. 構 成 図 3. 制 作 における 基 本 事 項 4. 画 面 設 計 の 定 義 ルール 5. 各 画 面 仕 様 設 計 6. 仕 様 書 確 定 の 合 意 更 新 履 歴 更 新 日 付 更 新 箇 所 更 新 内 容 構 成 図 A-1 トップページ 会 社 サービス 特 徴 コンテンツ サブコンテンツ その
(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) ユーザー 名 変 換
Fckeditor の 基 本 的 な 使 い 方 Point!! fckeditor を 上 手 く 使 うコツ 始 めにページ 内 に 一 通 り 文 章 ( 画 像 や 表 を 含 む)を 書 いてから 文 字 装 飾 をして 下 さい 編 集 したいテキストや 画 像 を 選 択 し アイコ
Fckeditor マニュアル 目 次 Fckeditor の 基 本 的 な 使 い 方... 2 記 事 の 登 録 プレビューの 前 に... 2 リンクを 挿 入... 5 画 像 を 挿 入 する... 6 PC に 保 存 している 画 像 の 挿 入... 6 WEB 上 の 画 像 を 挿 入... 8 文 字 装 飾... 10 文 章 を 見 出 しにする... 10 太 文 字
HTML5 による Webサイト制作の基本 株式会社サイバーガーデン 益子 貴寛 2012年4月7日 土曜日 CSS Nite in OKAYAMA, Vol.2 with Microsoft アップル http://www.apple.com/jp/ ローソン http://www.lawson.co.jp/
2 2-1 HTMLの 構 造 等 公 開 URLが 静 的 なHTMLであること 判 読 不 可 能 な 文 字 を 含 むものや 文 字 数 が 多 すぎるURL(いわゆる 動 的 なHTML)は 原 則 として 不 可 とする 2-2 任 意 なURLが 使 用 でき コンテンツ 作 成 時
1 1-1 サイト 全 般 デザイン 等 サイト 全 体 が 標 準 化 統 一 化 されたページデザインとすること ただし サイトで 異 なるデザインで 作 成 表 示 することができること 1-2 ヘッダー フッターは 原 則 すべてのページで 統 一 したデザインとすること 1-3 ロゴ イラスト バナーなどサイトに 応 じたデザインで 作 成 すること 1-4 スマートフォンやタブレット 端
おすすめページ
4-5 第 4 章 高 度 なリストのデザイン スマートフォン 向 けのCSSを 読 み 込 む スマートフォンのように 画 面 サイズの 小 さい 端 末 で 見 たときは 専 用 のCSSを 読 み 込 むように します 画 面 サイズが 小 さいときはレイアウトを 変 更 する スマートフォンなど パソコンに 比 べて 画 面 の 小 さい 端 末 で Web サイトを 閲 覧 しようとすると
(0) 準 備 自 分 のUSBメモリのなかに 自 分 の 学 番 の 名 前 をつけたフォルダを 作 成 する( 例 :5210001) 以 下 で 作 成 使 用 する HTML 文 書 や 画 像 ファイルはすべてこのフォルダの 中 に 作 成 すること (1)テキストエディタで HTML 文
情 報 リテラシー 第 13 回 ウェブページの 作 成 と 更 新 インターネットによって 世 界 中 の 人 に 瞬 時 に 情 報 を 伝 えることができるようになった ウェブページ はその 情 報 発 信 基 地 である ここではウェブページの 作 り 方 を 学 ぶ コンピュータ ストアにはたくさ んのウェブページ 作 成 ソフトが 市 販 されており 操 作 法 はソフトによって 様 々である
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
3 1 5 1.1....................................... 6 1.2.......................................... 6 1.3..................................... 7 1.4.................................... 8 1.4.1.............................
A
A. ツールボタン の 使 い 方 下 の 図 は NetCommons の 共 通 エディタで 表 示 されるツールボタンの 一 覧 です 書 式 設 定 左 からフォント サイズ スタイルを 設 定 するためのプルダウンメニューです 効 果 をつけたい 箇 所 の 先 頭 でク リックするか 効 果 をつけたい 箇 所 をカーソルで 選 択 してボタンをクリックします 文 字 効 果 左 から
- 目 次 - 1.はじめに...2 2.サイト 初 期 設 定...2 3.SiteBuilderインストール...5 4.サイトの 作 成...6 4.1 SiteBuilder ウィザードを 開 く...7 4.2 開 始...8 4.3 デザイン...9 4.3.1 デザインテンプレートの
KDDI ホスティングサービス (G120, G200) ブック SiteBuilder スタートアップガイド (ご 参 考 資 料 ) Rev.1.0 KDDI 株 式 会 社 1 - 目 次 - 1.はじめに...2 2.サイト 初 期 設 定...2 3.SiteBuilderインストール...5 4.サイトの 作 成...6 4.1 SiteBuilder ウィザードを 開 く...7 4.2
CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6] 便 利 な 機 能
![CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6] 便 利 な 機 能](/thumbs/41/22686340.jpg "CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6] 便 利 な 機 能")
CMS デザインガイド [1/12] CMS デザインガイド Contents Management System 2006/6/5 CMS デザインガイド [2/12] ::: 目 次 [ A-1] CMSの 仕 組 み [ A-2] テンプレートについて [ A-3] テンプレートの 作 成 [ A-4] template.iniについて [ A-5] テンプレートの 配 置 について [ A-6]
16. ペルソナ シナリオ 法 におけるペルソナとは ある 実 在 する 特 定 の 1 人 の 人 物 のことである 17. ユーザインタフェースの 分 野 での GUI とは ジオグラフィック ユーザ インタフェースの 略 称 で ある 18. HTML 4.01 Strict では XML 宣
各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 1. CSS において div, p のような 記 述 は 子 孫 セレクタの 指 定 である 2. URL 中 のパスにおいて ファイル 名 を 指 定 せずにディレクトリ 名 だけ 指 定 した 場 合 必 ずそのディ レクトリ 内 の index.html が 表 示 される
情報公開システム論2.pptx
情 報 公 開 システム 論 (2) 神 戸 情 報 大 学 院 大 学 横 山 輝 明 電 子 文 書 としてのWebページ 2 ホームページ(1) ホームページ 自 由 に 作 成 安 価 世 界 中 に 公 開 多 彩 な 表 現 力 双 方 向 性 - 島 根 県 立 大 学 - 島 根 県 立 大 学 短 期 大 学 部 h,p://www.u- shimane.ac.jp/ 3 ホームページ(2)
カゴラボ管理画面マニュアル（3.商品管理）
カゴラボ 管 理 画 面 操 作 設 定 マニュアル CHAPTER 3 商 品 管 理 編 カゴラボバージョン4.0 系 お 問 い 合 せはこちらまで カゴラボサポートセンター 0120-713-362 ( 携 帯 電 話 からは 0985-23-3362 ) E-mail : support@cagolab.jp 受 付 時 間 : 平 日 10:00~12:00/13:00~18:00 (
3.コンテンツの 作 成 機 能 3-1 IDごとに 編 集 権 限 を 設 け 権 限 に 応 じたメニューが 表 示 されること 3-2 管 理 者 はすべてのページにおいて 編 集 する 権 限 があること 3-3 複 数 のユーザーが 同 時 に 同 一 のページを 更 新 できないこと 基
( 別 紙 ) 志 摩 市 ホームページ 構 築 業 務 CMS 機 能 調 査 表 対 応 欄 : 本 業 務 の 委 託 費 用 内 で 対 応 可 能 : 代 替 案 により 本 業 務 の 委 託 費 用 内 で 対 応 可 能 ( 代 替 案 欄 に 代 替 案 をご 記 入 ください ) : 対 応 不 可 項 目 番 号 要 件 対 応 代 替 案 1-1 1.システム 基 本 要 件
1 委 託 業 務 の 内 容 (1) 名 称 公 益 財 団 法 人 京 都 市 景 観 まちづくりセンターホームページ 製 作 業 務 (2) 委 託 内 容 仕 様 書 ( 別 紙 1)のとおり (3)スケジュール( 予 定 ) 平 成 27 年 11 月 中 旬 委 託 契 約 締 結 平
公 益 財 団 法 人 京 都 市 景 観 まちづくりセンター ホームページ 製 作 業 務 受 託 候 補 者 選 定 に 係 る 募 集 要 項 応 募 書 類 の 提 出 期 限 平 成 27 年 10 月 13 日 ( 火 )から 平 成 27 年 10 月 29 日 ( 木 ) 午 後 5 時 まで 応 募 書 類 は 郵 送 又 は 持 参 ください ( 郵 送 の 場 合 簡 易 書