文 書 構 造 とスタイル
|
|
- さや かたいわ
- 7 years ago
- Views:
Transcription
1 第 4 回 の 内 容 文 書 構 造 とスタイル CSSの 基 礎 図 表 の 利 用
2 文 書 構 造 とスタイル
3 自 己 紹 介 のHTML 文 書 <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> 放 送 太 郎 の 自 己 紹 介 </title> </head> <body> <h1> 放 送 太 郎 の 自 己 紹 介 </h1> <h2> 略 歴 </h2> <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの29 歳 です 大 学 では 英 文 学 を 学 びました 現 在 は 千 葉 県 の<a href=" 放 送 大 学 </a> 本 部 で 勤 務 しています </p> <h2> 趣 味 </h2> <ul> <li> 読 書 </li> <li>オートバイ</li> <li>プラモデル 製 作 </li> </ul> <address> 連 絡 先 : <a href="mailto:taro@example.com">taro@example.com</a></address> </body> </html>
4 Webブラウザでの 表 示 背 景 色 は 白 文 字 色 は 黒
5 Webブラウザでの 表 示 <h1> 放 送 太 郎 の 自 己 紹 介 </h1>
6 Webブラウザでの 表 示 <h2> 略 歴 </h2> <h2> 趣 味 </h2>
7 Webブラウザでの 表 示 <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの </p>
8 Webブラウザでの 表 示 <ul> <li> 読 書 </li> <li>オートバイ</li> <li>プラモデル 製 作 </li> </ul>
9 Webブラウザでの 表 示 <address> 連 絡 先 : </address>
10 Webブラウザでの 表 示 <a href=" 放 送 大 学 </a> <a
11 Webブラウザでの 表 示 Internet Explorer Mozilla Firefox
12 Webブラウザでの 表 示 携 帯 電 話 (シミュレータ) スマートフォン
13 Webブラウザでの 表 示
14 Webページの 見 た 目 HTMLの 規 格 では 定 められていない Webブラウザ 独 自 のスタイルで 表 示 HTML 文 書 構 造 ( 意 味 ) スタイルシート スタイル( 見 た 目 )
15 ワープロソフトのスタイル
16 ワープロソフトのスタイル
17 ワープロソフトのスタイル
18 ワープロソフトのスタイル
19 ワープロソフトのスタイル
20 ワープロソフトのスタイル
21 Cascading Style Sheets (CSS) HTML 文 書 (Webページ)に 適 用 できるスタイルシート 言 語 W3Cが 標 準 化 いくつかのバージョン
22 CSSの 指 定 <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <link rel="stylesheet" href="./style.css" type="text/css"> <title> 放 送 太 郎 の 自 己 紹 介 </title> </head> <body> <h1> 放 送 太 郎 の 自 己 紹 介 </h1> <h2> 略 歴 </h2> <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの29 歳 です 大 学 では 英 文 学 を 学 びました 現 在 は 千 葉 県 の<a href=" 放 送 大 学 </a> 本 部 で 勤 務 しています </p> <h2> 趣 味 </h2> <ul> <li> 読 書 </li> <li>オートバイ</li> <li>プラモデル 製 作 </li> </ul> <address> 連 絡 先 : <a href="mailto:taro@example.com">taro@example.com</a></address> </body> </html>
23 CSSの 適 用
24 CSSの 適 用
25 CSSの 適 用 body { line-height: 1.4; } h1 { border-top: 1px solid #a7bfde; border-bottom: 4px solid #9bbb59; color: #243f60; font-style: italic; font-weight: normal; padding-top: 1ex; padding-bottom: 1.2ex; text-align: center; } h2 { border-bottom: 2px solid #365f91; color: #365f91; font-size: 100%; margin-top: 4ex; padding-bottom: 2px; } p { margin: 0; text-align: justify; text-indent: 2em; } ul { margin: 0; padding-left: 2em; } address { font-style: normal; }
26 CSSの 適 用 Microsoft Word 2010の 組 み 込 みのクイック スタイルセットを 模 倣 して 作 りました
27 CSSの 適 用
28 CSSの 適 用 body { font-style: italic; line-height: 1.6; } h1 { background-color: #c0504d; color: #ffffff; font-weight: normal; padding: 0.5ex; text-align: center; } h2 { background-color: #f2dbdb; border: 1px solid #c0504d; color: #622423; font-size: 95%; margin-top: 4ex; padding-left: 2px; } p { margin: 0; text-align: justify; } ul { margin: 0 0 2ex; padding-left: 1em; }
29 CSSの 適 用 Microsoft Word 2010の 組 み 込 みのクイック スタイルセットを 模 倣 して 作 りました
30 CSSに 関 連 した 機 能 出 力 媒 体 に 応 じたCSSの 適 用 ユーザーが 選 択 可 能 なCSS ユーザー 独 自 のCSSの 適 用
31 出 力 媒 体 に 応 じたCSSの 適 用 出 力 媒 体 (メディアタイプ)に 応 じて 適 用 するCSSを 切 り 替 えられる all braille embossed handheld print projection screen speech tty tv
32 出 力 媒 体 に 応 じたCSSの 適 用
33 ユーザーが 選 択 可 能 なCSS traditional.css を 適 用 fancy.css を 適 用
34 ユーザーが 選 択 可 能 なCSS <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <link rel="stylesheet" href="./default.css" type="text/css" title=" 既 定 "> <link rel="alternate stylesheet" href="./traditional.css" type="text/css" title="トラディショナル"> <link rel="alternate stylesheet" href="./fancy.css" type="text/css" title="ファンシー"> <title> 放 送 太 郎 の 自 己 紹 介 </title> </head> <body> 代 替 スタイルシート
35 ユーザーが 選 択 可 能 なCSS Microsoft Word 2010の 組 み 込 みのクイックスタイルセットを 模 倣 して 作 りました
36 ユーザー 独 自 のCSSの 適 用
37 ユーザー 独 自 のCSSの 適 用 ページ 制 作 者 が 指 定 するスタイル ユーザー 独 自 のスタイル Webブラウザ 既 定 のスタイル
38 スタイルの 分 離
39 CSSの 基 礎
40 CSSの 例 h1 { background-color: #000000; color: #ffffff; } 大 見 出 し(h1)は 背 景 色 (background-color)を 黒 (#000000) 文 字 色 (color)を 白 (#ffffff)にする
41 CSSの 例 このスタイルの 適 用 前 このスタイルの 適 用 後 h1 要 素
42 CSSの 例 p { text-indent: 1em; } 段 落 (p)は 先 頭 行 の 字 下 げ 幅 (text-indent)を1 文 字 (1em)にする
43 CSSの 例 このスタイルの 適 用 前 このスタイルの 適 用 後 p 要 素
44 CSSの 例 address { text-align: center; font-size: 80%; } 連 絡 先 (address)は 配 置 (text-align)を 中 央 揃 え(center) にし 文 字 の 大 きさ(font-size)を 通 常 の0.8 倍 (80%)にする
45 CSSの 例 このスタイルの 適 用 前 このスタイルの 適 用 後 address 要 素
46 CSSの 例 h1 { background-color: #000000; color: #ffffff; } p { text-indent: 1em; } address { text-align: center; font-size: 80%; }
47 CSSの 構 文 セレクタ { プロパティ1: 値 1; プロパティ2: 値 2; }
48 CSSのセレクタ ( 一 部 ) 種 類 記 述 方 法 ユニバーサルセレクタ * 型 セレクタ E 子 孫 セレクタ E F IDセレクタ E#myid
49 型 セレクタ CSS h2 { font-size: 120%; } HTML <h1> 放 送 太 郎 の 自 己 紹 介 </h1> <h2> 略 歴 </h2> <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの </p> <h2> 趣 味 </h2>
50 CSSのセレクタ ( 一 部 ) 種 類 記 述 方 法 ユニバーサルセレクタ * 型 セレクタ E 子 孫 セレクタ E F IDセレクタ E#myid
51 CSS p a { text-decoration: none; } HTML 子 孫 セレクタ <p> 千 葉 県 の<a href=" 放 送 大 学 </a> 本 部 で </p> <address> 連 絡 先 : <a
52 CSSのセレクタ ( 一 部 ) 種 類 記 述 方 法 ユニバーサルセレクタ * 型 セレクタ E 子 孫 セレクタ E F IDセレクタ E#myid
53 CSS IDセレクタ h2#hobby { border-left: 10px solid #006400; } HTML <h2> 略 歴 </h2> <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの </p> <h2 id="hobby"> 趣 味 </h2>
54 IDセレクタ h2#hobby *#hobby #hobby <h2 id="hobby"> 趣 味 </h2> <ul id="hobby"> <li> 読 書 </li> <li>オートバイ</li> <li>プラモデル 製 作 </li> </ul>
55 CSSの 構 文 セレクタ { プロパティ1: 値 1; プロパティ2: 値 2; }
56 CSSのプロパティ background-color: 背 景 色 ; color: 文 字 色 ;
57 色 の 指 定 光 の 三 原 色 である 赤 (Red) 緑 (Green) 青 (Blue)の 強 さで 指 定 最 初 に # 緑 の 強 さ #xxxxxx 赤 の 強 さ 青 の 強 さ 十 六 進 数 で 00( 一 番 弱 い) ~ ff( 一 番 強 い)
58 色 の 指 定 # black #ff0000 red #00ff00 lime #0000ff blue #ffff00 yellow #ff00ff fuchsia #00ffff aqua #ffffff white # green # purple #ffa500 orange #c0c0c0 silver
59 CSSの 例 h1 { background-color: #000000; color: #ffffff; } 大 見 出 し(h1)は 背 景 色 (background-color)を 黒 (#000000) 文 字 色 (color)を 白 (#ffffff)にする
60 図 表 の 利 用
61 表 の 構 成 ヘッダセル キャプション ヘッダ ボ デ ィ フッタ データセル セル
62 表 のマークアップ 例 <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> <thead> <tr><th> 学 生 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table>
63 表 のマークアップ 例 <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> <thead> <tr><th> 学 生 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table> 全 体 がtable 要 素
64 表 のマークアップ 例 キャプション <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> <thead> <tr><th> 学 生 ヘッダ 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 フッタ </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 ボディ 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table> table 要 素 の 中 にcaption thead tfoot tbody 要 素
65 表 のマークアップ 例 <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> <thead> <tr><th> 学 生 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table> ヘッダ フッタ ボディの1 行 がtr 要 素
66 表 のマークアップ 例 <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> th ヘッダセル <thead> <tr><th> 学 生 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table> td データセル tr 要 素 の 中 にth 要 素 またはtd 要 素
67 表 の 構 造 全 体 がtable 要 素 table 要 素 の 中 に caption 要 素 キャプション thead 要 素 ヘッダ tfoot 要 素 フッタ tbody 要 素 ボディ thead tfoot tbody 要 素 の 中 に tr 要 素 表 の1 行 tr 要 素 の 中 に th 要 素 ヘッダセル td 要 素 データセル
68 表 のマークアップ 例 <table> <caption> 放 送 大 学 教 養 学 部 の 入 学 者 数 </caption> <thead> <tr><th> 学 生 種 類 </th><th>2011 年 度 </th><th>2012 年 度 </th><th>2013 年 度 </th></tr> </thead> <tfoot> <tr><th> 合 計 </th><td>50,026</td><td>50,779</td><td>47,994</td></tr> </tfoot> <tbody> <tr><th> 全 科 履 修 生 </th><td>11,898</td><td>12,411</td><td>11,858</td></tr> <tr><th> 選 科 履 修 生 </th><td>17,020</td><td>18,094</td><td>17,459</td></tr> <tr><th> 科 目 履 修 生 </th><td>15,986</td><td>15,128</td><td>14,029</td></tr> <tr><th> 特 別 聴 講 学 生 </th><td>5,122</td><td>5,146</td><td>4,648</td></tr> </tbody> </table>
69 表 のスタイル
70 表 のスタイル th { background-color: #eeeeee; border: 1px solid #999999; } td { border: 1px solid #999999; }
71 表 のスタイル
72 表 のスタイル th { background-color: #eeeeee; border: 1px solid #999999; padding: 0.5em; } td { border: 1px solid #999999; padding: 0.5em; }
73 表 のスタイル
74 表 のスタイル th { background-color: #eeeeee; border: 1px solid #999999; font-weight: normal; padding: 0.5em; text-align: left; }
75 表 のスタイル
76 table { border-collapse: collapse; } 表 のスタイル
77 表 のスタイル
78 表 のスタイル thead > * { border-bottom: 5px double #999999; } tfoot > * { border-top: 5px double #999999; }
79 表 のスタイル
80 td { border: 1px solid #999999; font-family: monospace; padding: 0.5em; text-align: right; } 表 のスタイル
81 表 のスタイル
82 表 のスタイル caption { margin-bottom: 1ex; }
83 表 のスタイル
84 CSS table { border-collapse: collapse; } caption { margin-bottom: 1ex; } thead > * { border-bottom: 5px double #999999; } tfoot > * { border-top: 5px double #999999; } th { background-color: #eeeeee; border: 1px solid #999999; font-weight: normal; padding: 0.5em; text-align: left; } td { border: 1px solid #999999; font-family: monospace; padding: 0.5em; text-align: right; }
85 表 のスタイル
86 図 の 利 用 画 像 リソース(ファイル)を 別 に 用 意 し 要 素 型 imgを 用 いて 埋 め 込 む <img src=" 画 像 リソースのURI" alt=" 画 像 の 説 明 ">
87 マークアップ 例 <p> 神 奈 川 県 横 浜 市 出 身 1983 年 生 まれの29 歳 です 大 学 では 英 文 学 を 学 びました 現 在 は 千 葉 県 の<a href=" 放 送 大 学 </a> 本 部 で 勤 務 しています <img src="./ouj.jpg" alt=" 放 送 大 学 本 部 を 正 門 側 から 撮 った 写 真 右 の 建 物 の 屋 上 に 電 波 塔 が 見 える "> </p>
88 Webブラウザでの 表 示
89 第 4 回 の 内 容 文 書 構 造 とスタイル CSSの 基 礎 図 表 の 利 用
HTML5&CSS3 レッスンブック
STEP 7-6 Chapter 7 FINISHING & ARRANGE style.css STEP 7-6 で 置 き 換 えた style.css の 設 定 です DESIGN POINTS デザインのポイント Google Fontsの Bowlby One で 表 示 ナビゲーションメニューの 各 リンクは 四 角 形 にデザイン コンテンツは 罫 線 で 囲 まない メインコンテンツの
More information第3回HP講習会資料ver1.2(2007.9.20)
1.はじめに 第 3 回 技 術 センター 職 員 向 けHP 講 習 会 では スタイルシートの 基 礎 として CSSを 使 った Webページを 作 成 していきます HTMLだけでは 出 来 ないCSSを 用 いたレイアウトを 分 かり 易 く 体 験 してもらえるように 今 回 はCSSの 中 でもクラスやIDといった 概 念 を 省 いています 2.スタイルシートとは? スタイルシート
More informationCSSの基礎
Webページの 見 た 目 を 定 義 する 視 覚 のための 言 語 CSS ファイル 視 覚 表 現 関 連 付 ける HTML ファイル 論 理 構 造 CSSの 基 礎 CSSの 記 述 方 法 基 本 的 な 形 セレクタ{ プロパティ1: 値 ; プロパティ2: 値 ; セレクタの 種 類 タイプセレクタ CSSの 記 述 HTML CSSを 適 用 する 箇 所 CSSを 記 述 する
More information演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z: W
Webデータ 管 理 HTML+CSS (4) (2 章 ) 2011/10/26( 水 ) 1/21 演 習 室 のPCのハードディスクには 演 習 で 作 成 したデータは 保 管 できません 各 PCの ネットワーク 接 続 ショートカットからメディア 情 報 セ ンターのサーバーにアクセスしてください(Zドライブとして 使 用 できます) 演 習 名 使 用 するフォルダ 演 習 1 Z:
More informationスタイルシートでデザインを整えよう
スタイルシートでデザイン(2) CSS (Cascading Style Sheets) ここまで HTML は 文 章 の 意 味 的 な 役 割 を 記 述 するもので 表 示 はブラウザ 次 第 であること を 強 調 してきました あるブラウザでの 表 示 方 法 を 前 提 に HTML で 見 た 目 を 制 御 しようとす ると 他 の 環 境 では 意 味 が 通 じにくい 相 互
More information6 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 informationTaro-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ホームページ制作スターターズ
HTML タグ はじめての 方 ガイド Ver1.0 1 < 目 次 > 1ホームページ 構 造 2HTML タグ 3スタイルシート Copyright ナレッジコーディネーター All Rights Reserved. 2 第 1 章 ホームページ 構 造 Copyright ナレッジコーディネーター All Rights Reserved. 3 1HTMLとは ウェブ 上 の 文 書 を 記 述
More informationスライド 1
第 7 講 観 光 情 報 論 2008 年 6 月 4 日 Style Sheet (CSS) 宮 国 薫 子 1 スタイルシート (CSS) CSSとは(Cascading Style Sheets) 本 来 ホームページにデザインを 加 える 機 能 の すべて 教 科 書 で 言 う スタイルシート とはCSSのことを 指 す CSSを 使 うと Page 106 にあるようにホーム ページの
More informationコンピュータサイエンス 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インターネットマガジン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練 習 問 題 1. dataフォルダのq1フォルダ 内 のindex.htmlでブラウザで 正 しく 表 示 できない 状 態 にあ る 画 像 を 正 常 に 表 示 できるようにソースを 修 正 しなさい 修 正 したindex.htmlファイルなどは デスクトップのwdフォルダ 内 にt1と
ウェブデザイン 技 能 検 定 3 級 実 技 練 習 問 題 本 練 習 問 題 の 著 作 権 は 当 協 会 に 帰 属 します 協 会 の 提 供 する 一 部 又 は 全 ての 練 習 問 題 を 無 断 で 複 写 転 載 営 利 利 用 することを 禁 止 します 内 容 解 答 その 他 一 切 のお 問 い 合 わせは 受 け 付 けておりません 本 練 習 問 題 と 実 際 の
More information■新聞記事
情 報 処 理 C (P.1) 情 報 処 理 C (2016 年 度 ) ホームページ 作 成 入 門 テキストエディタ(メモ 帳 TeraPad など)でHTMLファイルを 作 成 する HTML(Hyper Text Markup Language ) ホームページを 記 述 するための 言 語 のこと テキストエディタの 起 動 (TeraPad の 場 合 ) [スタート]-[プログラム]-[テキストエディタ]-[TeraPad]
More informationMicrosoft PowerPoint - 08回目.pptx
1 コンピュータリテラシーII ( 樋 口 担 当 ) 4 回 目 10/17 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I.スタイルシート II.レイアウト III. 課 題 3 I.スタイルシート 1.スタイルシート 4 スタイルシート: 文 書 のスタイルの 設 定 が 書 かれているデータ CSS:スタイルシートの 書 き 方 ( 言 語 )の 一 つ Cascading
More information確 認 とアップロード (2) ブラウザを 使 用 して 確 認 内 容 の 修 正 ブラウザでファイルを 開 き 表 示 されるページを 確 認 エディタで 修 正 し 上 書 保 存 した 後 再 読 込 み( 更 新 ) ボタン 上 記 作 業 を 繰 り 返 す (3) 完 成 したファイル
Webによる 情 報 提 供 リクエスト Webサーバ レスポンス ブラウザ 宮 原 のホームページ
More informationMicrosoft PowerPoint - HTML1復習_1021.ppt
HTML-Ⅱ(HTML 文 書 構 造 編 ) 3-1 HTML 基 本 構 造 html おいしいお 店 一 覧
More information27短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第7章 Webページによる情報の発信
筑 波 大 学 情 報 処 理 実 習 Webページによる 情 報 の 発 信 情 報 処 理 実 習 用 手 引 き P.197~226 World Wide Web (WWW) インターネット 上 のハイパーテキストシステム 1989 年 にCERNの 物 理 学 者 Tim Berners-Leeが 発 明 WWWはインターネットとも 呼 ばれるが, 両 者 は 同 義 語 ではない WebページのアドレスURL
More information388-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 informationHTML は 本 来 文 書 の 構 造 を 定 義 文 書 の 見 栄 えはスタイルシートで 記 述 HTML HyperText Markup Language 出 典 : フリー 百 科 事 典 ウィキペディア(Wikipedia) HyperText Markup Language(ハイパー
Web ページ 作 成 2011/ 5/31 Web ページとは IT 用 語 事 典 e-words より Web ページ web page 読 み 方 : ウェブページ WWW システムを 使 ってインターネット 上 で 公 開 されている 文 書 Web ブラウザに 一 度 に 表 示 されるデータのまとまりで テキストデータや HTML によるレイアウト 情 報 文 書 中 に 埋 め 込
More information2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正
1 情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく
More informationInfoPros13_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(1)
第 回 アビリンピック 京 都 大 会 ホームページ 部 門 練 習 問 題 (1) 仕 様 1 ホームページの 内 容 府 立 京 都 高 等 技 術 専 門 校 のホームページを 作 成 する 2 ページ 構 成 とファイル index.html guid.html course.html mystyle.css ie.css 以 上 のファイルと 素 材 はホームページよりダウンロードして
More informationuntitled
MoogaOne 1. MoogaOne... 1 2. MoogaOne... 1 3.... 1 4.... 1 5.... 2 6.... 2 1.... 2 2.... 2 3. Template.htm... 2 4. index.htm... 4 [ ]... 4 5.... 4 6.... 6 7.... 6 8.... 6 [Template.htm Template-e.htm
More information経営論集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 informationtextbook.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 informationHTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17
1 11 13 2 11 27 3 12 11 HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17 WWW(World Wide Web) HTML(HyperText Markup Language) HTML HTML HTML HTML - 1 - .1 HTML (V)(C) HTML - 2 - HTML HTML OS Windows 2.1 HTML
More informationあいち電子自治体ガイドライン(第1章)
1-1 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インターネットマガジン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 information1 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第9回
第 9 回 2016 年 7 月 16 日 情 報 教 育 演 習 II 第 9 回 (1) CSS(4) (1) 今 回 の 課 題 (2) リストの 記 号 や 番 号 の 設 定 (2) クラスの 利 用 (2) クラスとは (2) クラスを 使 った 設 定 (3) CSSファイルでの 設 定 (3) HTMLファイルでの 利 用 (3) クラスの 利 用 例 (1) (3) クラスの 利
More information情報公開システム論2.pptx
情 報 公 開 システム 論 (2) 神 戸 情 報 大 学 院 大 学 横 山 輝 明 電 子 文 書 としてのWebページ 2 ホームページ(1) ホームページ 自 由 に 作 成 安 価 世 界 中 に 公 開 多 彩 な 表 現 力 双 方 向 性 - 島 根 県 立 大 学 - 島 根 県 立 大 学 短 期 大 学 部 h,p://www.u- shimane.ac.jp/ 3 ホームページ(2)
More informationLecture/CompPracR2003/12th
Lecture/CompPracR2003/12th 2016 年 7 月 17 日 コンピュータ 演 習 ( 再 ) 第 12 回 (1) Webページの 作 成 (1) Webページを 作 成 する 道 具 (1) テキストエディタを 使 うメリット デメリット (2) HTML (2) HTMLとは (2) HTMLの 書 き 方 (3) HTMLファイルの 構 造 (3) 空 白 と 改 行
More informationWORD 98 入力の手引き
コンピュータ 基 礎 実 習 ( 上 級 ) 第 13 週 スタイルシートの 基 礎 今 回 の 授 業 は スタイルシート(CSS)の 使 い 方 を 解 説 します 1. CSS の 基 本 1.1. CSS とは CSS は Cascading Style Sheets の 略 で ウェブページの 見 栄 えを 設 定 するための 言 語 です CSS は 最 近 多 くのサイトで 使 用 され
More informationMicrosoft PowerPoint - InfPro_I9.pptx
今 日 の 学 習 内 容 エディタ(emacs)を 使 った 基 本 的 なHTML の 書 き 方 Webページの 公 開 HTMLの 基 礎 知 識 HTML(Hyper Text Markup Language)は Webページを 作 るための 必 要 な 記 述 言 語 HTMLにおける 指 定 の 内 容 は: 1. 文 章 (テキスト)に 対 する 役 割 2. 文 章 やイメージなどのページ
More informationMicrosoft PowerPoint - css [互換モード]
情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく 使
More informationMicrosoft PowerPoint - css.ppt [互換モード]
情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 W3Cで 推 奨 される
More information6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1
6 1 6 (1) (2) HTML (3) PDF Copy&Paste 1 Web 1 Web Web 1 Web HTML 6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1 6 3 1.1 HTML Web HTML(Hyper Text Markup Language)
More information: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1
: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1 2 : : 1 1 : 3 : 2 (.ppsx) (A0nxxyyy.ppsx) presen (1 ) ID:A0nxxyyy Name: Title: 3 HTML (HyperText Markup Language) 4 ( ) http://pweb.cc.sophia.ac.jp
More information1 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目 次 1.CSSとは? 予 備 知 識 2.common.css 3.calendar.css 4.archive_layout.css 5.left_layout.css 6.right_layout.css 7.three_layout.css 3 6 7 27 31 33 36 39 2
株 式 会 社 アイ オー データ 機 器 CSS 解 説 書 目 次 1.CSSとは? 予 備 知 識 2.common.css 3.calendar.css 4.archive_layout.css 5.left_layout.css 6.right_layout.css 7.three_layout.css 3 6 7 27 31 33 36 39 2 1.CSSとは? 3 1.CSSとは?
More informationWorld Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML
Web 工学博士大堀隆文 博士 ( 工学 ) 木下正博 共著 World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML ii HTML CSS CSS HTML HTML HTML HTML Eclipse Eclipse Eclipse
More information07_経営論集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クリック クリック リンクを 張 るためのタグ タグ <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 informationMicrosoft Word - 2016メディプロ1HTML統合版v1
2016 年 度 メディアプロジェクト 演 習 1 HTML 講 座 発 展 編 2 ~ CSS と Web アクセシビリティ 立 命 館 大 学 情 報 理 工 学 部 メディア 情 報 学 科 進 捗 が 遅 れている 場 合 に 限 り,テキスト 中 で 省 略 可 マークのついた 節 は 省 略 してもよい. 1 はじめに 本 演 習 ではこれまで, 様 々なタグを 用 いた 基 礎 的 な
More informationMicrosoft Word - メディア技術基礎.docx
メディア 技 術 基 礎 (Web) 脇 田 玲 先 生 (2010) 田 中 浩 也 (2011) HTML の 基 本 的 な 書 き 方 テキストエディタで index.html を 作 成 して 以 下 のサンプルを 入 力 してみましょう 始 めの 2 行 は HTML を 書 く 前 のおまじないの 様 なものです ここで 登 場 する HTML タグについての 説 明 は 以 下 の
More informationHTTPの 規 格
第 5 回 の 内 容 HTTPの 規 格 HTTPメッセージの 基 本 HTTPの 規 格 HTTPの 規 格 Internet Engineering Task Force (IETF) Request for Comments (RFC) 年 バージョン RFC 1996 年 HTTP/1.0 RFC 1945 Hypertext Transfer Protocol -- HTTP/1.0 1997
More informationWeb10.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 information1/2
札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト (2) 1 札 幌 学 院 大 学 社 会 情 報 学 部 AO 入 試 課 題 用 テキスト HTMLの 基 礎 知 識 (2) 1 画 像 の 表 示 HPに 画 像 を 表 示 させてみる まず HTML 文 書 と 同 じフォルダ 内 にJPEGファイル( 拡 張 子.jpg )を1 個 準 備 する ( 画
More information立ち読みページ
6 6 46. 47. 48. 49. 50. 51. 52. 53. 146 148 150 152 154 158 160 162 6 46 Web ( ) table tr td th >> HTML
More information1 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 informationCascade 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 informationHTMLとメタデータ
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(Microsoft Word - \203u\203\215\203O\215\354\220\254.doc)
ブログをカスタマイズ! ~HTML HTML CSS を 使 ってブログを 自 分 の 好 みにしちゃおう ~ ブログを 登 録 しよう! ブログってなんだろう? ブログとはインターネット 上 で 管 理 者 が 記 事 を 投 稿 する 私 的 ニュースサイト あるいは 日 記 的 なもののこと 個 人 のホームページを 持 たなくても 簡 単 に 自 分 が 書 きたいことを 作 って 載 せることができる
More informationHTML文書の作成
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 informationeil2009062930_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 informationWeb概論
HTML/CSS Chapter 04 スタイルシートを使う Copyright 2011 ZDRIVE, K.K. All rights reserved. 4.1 CSS の仕組みと書式 CSS とは Cascading Style Sheet の略 単に スタイルシート と呼ばれることもある HTML で作ったページにレイアウトや装飾などのデザインを施すための仕組み CSS を記述したファイルは.css
More informationHTMLとは 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 informationp { color: yellow } div#hoge { color: green; } div.fuga { color: red; } div { color: orange; } div[id=hoge] { color: blue; } div#hoge
More information6 2 1
6 1 6 (1) (2) HTML (3) 1 Web HTML 1 Web 1 Web Web 6 2 1 6 3 1.1 HTML(XHTML) Web HTML(Hyper Text Markup Language) ( ) html htm HTML XHTML(XHTML 1.0 Transitional)
More informationスライド 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コンピュータサイエンス 4. ウェブプログラミング
4. Chris Plaintail 2014 1 / 43 1 HTML CSS 2 JavaScript DOM jquery 3 4 PHP SQL PHP SQL 2 / 43 HTML HTML CSS HTML Ajax (Asynchronous JavaScript + XML) PHP SQL 3 / 43 HTML, CSS http, https CSS HTML CSS.html
More information目 次 XHTML 編... 1 共 通 属 性... 1 文 書 構 造... 1 文 書... 2 リスト... 3 テーブル( 表 )... 3 リンク... 6 オブジェクト... 7 スタイルシート... 7 装 飾... 7 フォーム... 7 文 字 実 体 参 照... 9 CSS
Web クリエイター 能 力 認 定 試 験 スタンダード エキスパート 共 通 XHTML 1.0 対 応 受 験 者 用 リファレンス 目 次 XHTML 編... 1 共 通 属 性... 1 文 書 構 造... 1 文 書... 2 リスト... 3 テーブル( 表 )... 3 リンク... 6 オブジェクト... 7 スタイルシート... 7 装 飾... 7 フォーム... 7 文
More information~/WWW-local/compIID (WWW IID ) $ mkdir WWW-local $ cd WWW-local $ mkdir compiid 3. Emacs index.html n (a) $ cd ~/WWW/compIID
10 10 10.1 1. 2. 3. HTML(HyperText Markup Language) Web [ ][ ] HTML Web HTML HTML Web HTML ~b08a001/www/ ( ) ~b08a001/www-local/ ( ) html ( ) 10.2 WWW WWW-local b08a001 ~b08a001/www/ ~b08a001/www-local/
More informationpadding( パディング ) padding プロパティでボックスの内側の余白を指定します この部分の内側には背景 ( 背景色や背景画像 ) を表示できます border( ボーダー ) border プロパティでボックスの境界線を指定します ボーダーには色 太さ 線の種類を指定できます 画像で
1111 基本のボックス (margin, width, height, border, background) CSS3 アニメーション ( およびトランジション ) の基本はボックスです このボックスに色を付けたり ボックスにテキスト ( 文字 ) や画像を入れて ボックスを移動 回転 2D 変形 3D 変形してアニメーションを作ります では先ずボックスを作ってみましょう 基本的なボックスは下の四角形のようなものです
More information第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C
1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 HTML5 では タグの 省 略 は 一 切 認 められていない 第 2 問 インターネット 上 のすべてのコンピュータは イーサネットで 繋 がっている 第 3 問 新 規 にウェブサイトを 公 開 する 際 は HTML ドキュメントをアップロードした 後 に
More informationNetwork 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 informationMicrosoft PowerPoint - 第03回目.pptx
1 情 報 リテラシーII ( 樋 口 担 当 ) 3 回 目 10/10 本 日 の 予 定 2 Webページの 作 成 I.テキストの 記 述 方 法 II.ハイパーリンク III.インラインイメージ( 画 像 ) IV. 表 V. 課 題 3 I.テキストの 記 述 方 法 1. 改 行 4 終 了 タグは 無 い 改 行 していない なすび なすびがいっぱい
More information8 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
More informationWeb
Web 1 1 1........................... 1 2 Web...................... 1 3...................... 3 4........................ 4 5........................... 5 i............................ 5 ii iii..........................
More informationMicrosoft PowerPoint - CSS(Cascading Style Sheets)の基本.pptx
CSS(Cascading Style Sheets) の基本 1. CSSの基本的な考え方は HTMLの構造を表す要素 ( タグ ) に対しスタイルを定義するというもの 2. CSSでは セレクタ プロパティ 値 の3つを組み合わせてスタイルを設定する 3. セレクタ は ,, や 要素などコンテンツ内のどの要素にスタイルを適用するかを指定する 4. セレクタの次の
More informationインターネットマガジン1997年4月号―INTERNET magazine No.27
3.0 4.0 A N S W E R1 A N S W E R2 308 INTERNET magazine 1997/4 1 jhttp://www.tucows.com/ A { text-ecoration: none; } INTERNET magazine
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¥Í¥Ã¥È¥ï¡¼¥¯¥×¥í¥°¥é¥ß¥ó¥°ÆÃÏÀ
HTTP/2 HTTP/1.1 (1999 ) 2015 5 RFC7540! Google SPDY ( ) 1 TCP TCP TLS HTTP Upgrade HTTP 1 HPACK 1 / 24 3 : HTTP : HTML4 2 / 24 testform.html: POST testform2.html: GET iedemo: IE default.css: CSS proxy.pac:
More informationCSS3
オレたちAndroid CSS @media only screen and (max-device-width: 480px) {! div#wrapper {!! width: 400px;! }! div#header {!! background-image: url(media-queries-phone.jpg);!! height: 93px;!! position: relative;!
More information2014メディプロ1HTML発展編2
04 年 度 メディアプロジェクト 演 習 HTML 講 座 発 展 編 ~ CSS と Web アクセシビリティ 立 命 館 大 学 情 報 理 工 学 部 メディア 情 報 学 科 進 捗 が 遅 れている 場 合 に 限 り,テキスト 中 で 省 略 可 マークのついた 節 は 省 略 してもよい. はじめに 本 演 習 ではこれまで, 様 々なタグを 用 いた 基 礎 的 な Web ページの
More informationTable of Contents... 3 XML... 3... 3... 4 XSL... 4 CSS XML... 5 CSS... 5 HTML+CSS... 6 CSS XML... 7 CSS... 8 XSLT XML HTML(+CSS)... 9 IE5 XML... 9 IE5
2001 2 Table of Contents... 3 XML... 3... 3... 4 XSL... 4 CSS XML... 5 CSS... 5 HTML+CSS... 6 CSS XML... 7 CSS... 8 XSLT XML HTML(+CSS)... 9 IE5 XML... 9 IE5... 9 XSLT... 10 XSLT... 11 XML HTML... 11 XML
More informationhtml_text
HTML の 基 礎 2015.12.15 1. HTML ファイルの 構 成 1.1. HTML とは? Web ブラウザでホームページを 表 示 するためには,HTML(Hyper Text Markup Language)と 呼 ぶ 言 語 で 記 述 す る 必 要 が あ り ま す.HTML 形 式 のファイルは < と > で 囲 んだ 予 約 語 (タグ)を 含 むテキストファイルで,Web
More information16. ペルソナ シナリオ 法 におけるペルソナとは ある 実 在 する 特 定 の 1 人 の 人 物 のことである 17. ユーザインタフェースの 分 野 での GUI とは ジオグラフィック ユーザ インタフェースの 略 称 で ある 18. HTML 4.01 Strict では XML 宣
各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 1. CSS において div, p のような 記 述 は 子 孫 セレクタの 指 定 である 2. URL 中 のパスにおいて ファイル 名 を 指 定 せずにディレクトリ 名 だけ 指 定 した 場 合 必 ずそのディ レクトリ 内 の index.html が 表 示 される
More informationuntitled
2005 HP -1-2005 8 29 30 HP 1 ( ) 1. Web 2. HTML HTML 1 PDF HTML 1 Web HTML http://www.media.ritsumei.ac.jp/kodais2005 2 2.1 WWW HTML Hyper Text Markup Language) HTML Web HTML Internet Explorer http://www.ritsumei.ac.jp
More informationPowerPoint プレゼンテーション
ホームページの 基 礎 IPアドレス インターネットへの 接 続 に 必 要 なネットワーク 上 のアドレス こ のアドレスは0から255までの4 組 に 数 字 で 表 されます ( 例 192.168.1.1) URL IPアドレスはホームページの 場 所 を 示 す 住 所 です たとえば 220.133.0.1に 接 続 しようとして ブラウザーのURLに 220.133.0.1と 入 れればいいのですが
More information</BODY> </HTML> HTML HTML HTML HTML <HTML> </HTML> <HTML> </HTML> HTML <HEAD> </HEAD> <TITLE> </TITLE> <BODY> </BODY> BODY moji.htm <HTML> <HEAD> <TIT
HTML HTML.html.htm HTML HTML FTP HTML HTML HTML 1 HTML HTML HTML HTML HTML
More information/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます " 出 し"の 部 分 をクリックすると"コンテンツですよ "の 字 が 表 されます もう 度 " 出 し"をクリックすると"コンテンツですよ "の 字 が 非 表 になります 折 りたたみパネルの 基
/ 0/0/ : [CSS] 折 りたたみ 可 能 なパネルの 作 成 - CSSのみを 利 した 折 りたたみ 領 域 / アコー ディオンパネル このページのタグ:[CSS] [アコーディオンパネル] 新 着 記 事 覧 タグ 覧 トップページ ipentec.com CSSのみを 利 した 折 りたたみ 可 能 なパネル( 折 りたたみ 可 能 領 域 )を 実 現 するコードを 紹 介 します
More information1 1 1.1............................. 1 1.2....................... 1 2 HTML 2 2.1 web HTML......................... 2 2.1.1 HTML.................... 2
XHTML DOM JavaScript 2 2008 7 1 1 1 1.1............................. 1 1.2....................... 1 2 HTML 2 2.1 web HTML......................... 2 2.1.1 HTML.................... 2 2.1.2 HTML.........................
More informationスタイルシートを 用 いた 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 information1 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 informationHTML+CSS_Lesson03_2s.indd
Windows ファイル 名 には 半 角 スペースも 使 用 しないよう 注 意 しましょう 1. _- 2 類 似 するコンテンツがある 際 に content001 content002 といった 連 続 するナンバリングでフォ ルダ 名 をつけることがあります この 方 法 だと 途 中 のコンテンツがなくなったり ネーミングのルールに 無 理 が 生 じたときに ファイル やフォルダを 管
More information1 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 informationCSS / 横 1 段 組 レイアウト ビルダー 起 動 新 規 作 成 名 前 を 付 けて 保 存 (ファイル 名 =01turkey-ta.html 保 存 場 所 =css-2) (1)id= contents 用 の 親 DIV タグを BODY の 中 に 入 れる 右 側 の タグ 一
外 部 スタイルシート(CSS)の 基 本 1. 外 部 スタイルシートを 作 るには 1Sマークをクリック 2 外 部 スタイルシートの 追 加 参 照 保 存 場 所 image が 入 っているファイルを 選 択 ファイル 名 に 名 前 を 付 ける( 例 index-ta) 保 存 3スタイルシートマネージャーを 閉 じて 上 書 き 保 存 4Sマークをクリック スタイルシート 情 報
More information問 題 1 背 景 色 という 文 字 列 の 背 景 をちょっと 青 っぽい 色 (#6699FF)で 表 示 するHMTLを 作 成 せよ <HTML><HEAD><TITLE>test11</TITLE> <BODY BGCOLOR="#FFFFFF"> この 部 分 は<STRONG STY
9.スタイルシートと JavaScript を 組 み 合 わせてみよう スタイルシートとは スタイルシートとは タグのみでは 実 現 不 可 能 なデザインレイアウトやページ 構 造 を 実 現 する 命 令 郡 です 主 に 次 の3つの 書 式 があります (1)インライン タグ 内 部 により 詳 細 なデザインを 組 み 込 む 書 式 です 例 : この 部 分 は
More information第7章 Webページによる情報の発信
筑 波 大 学 情 報 処 理 実 習 Webページによる 情 報 の 発 信 情 報 処 理 実 習 用 手 引 き P.193~234 World Wide Web (WWW) インターネット 上 のハイパーテキストシステム 1989 年 にCERNの 物 理 学 者 Tim Berners-Leeが 発 明 WWWはインターネットとも 呼 ばれるが, 両 者 は 同 義 語 ではない WebページのアドレスURL
More informationHTML入門
HTML ABC of Hyper Text Markup Language 2009 2 HTML2009 Copyright 2009 by BohYoh Shibata 3 WWW HTML WWW WWWworld wide web hyper text resource 4 HTML2009 http WWW httphyper text transfer protocol HTML HTMLhyper
More information1/2
札幌学院大学社会情報学部 AO 入試課題用テキスト (3) 1 札幌学院大学社会情報学部 AO 入試課題用テキスト HTML の基礎知識 (3) 1. スタイル指定 フォントの大きさや種類 行間 ページ上のレイアウトなどを文書の スタイル と呼び このスタイルを指定するためのデータを スタイルシート と呼ぶ 以下では CSS(Cascading Style Sheets) と呼ばれるスタイルシート言語を使用する
More information目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法... 6 1-1 テンプレートの 使 用... 6 1-2 キャラクタエンコーディング... 7 1-3 ヘッダーの 書 き 方... 7 1-4 画 像 について... 8 1-5 CSS の 書 き
Ver.2 ユーザマニュアル スタートガイド 第 2 版 最 終 更 新 日 2011/7/12 1 目 次 本 書 について... 3 はじめに... 5 第 1 章 コンテンツ 制 作 方 法... 6 1-1 テンプレートの 使 用... 6 1-2 キャラクタエンコーディング... 7 1-3 ヘッダーの 書 き 方... 7 1-4 画 像 について... 8 1-5 CSS の 書 き
More informationCSSで書籍組版を
CSSで 書 籍 組 版 を ( 有 )イー エイド 藤 島 雅 宏 FormatterClub CSS 書 籍 組 版 セミナー 講 演 資 料 開 催 日 2013 年 10 月 18 日 会 場 東 京 都 中 央 区 浜 町 区 民 館 簡 単 そう 易 しい 簡 単 なことしかできない CSSはWeb 用 であり 組 版 機 能 が 劣 る コンテンツはHTMLなので 構 造 が 簡 単
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 >
HTML HTML HyperText Markup Language (Markup Language) (< > ) 1 sample0.html ( ) html sample0.html // JavaScript
More informationホームページの作成
HTML5,CSS 資 料 HTML5 HTML の 文 法 HTML(Hyper Text Markup Language)は, 文 章 の 部 分 を Tag(タグ)と 呼 ばれ る 命 令 で 挟 んでいく タグは ... 開 始 終 了 のように 開 始 タグと 終 了 タグ 一 対 のペアになっている. タグは, 挟 まれた 部 分 がどのような 情 報 であるかを
More information<script type="text/javascript"><!-- あとで 分 離 --> $(function(){ $('#tabs div').hide(); $('#tabs div:first').show(); $('#tabs div:first div').show(); $('
index.html 東 広 島 EventMap
More information目 次 本 書 について... 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 の 書 き 方...
More information