Network Computing の基礎

Save this PDF as:
 WORD  PNG  TXT  JPG

Size: px
Start display at page:

Download "Network Computing の基礎"

Transcription

1

2 CSS Cascading Style Sheets Cascading = Style Sheets = CSS WEB HTML CSS 2

3 <h1> </h1> <h1> </h1> <p> <p> </p> </p> HTML h1 p CSS 3

4 CSS

5

6 CSS HTML sample1.html

7 CSS HTML sample2.html

8 CSS CSS sample2.css

9 CSS sample3.html

10 CSS CSS level1 W3C HTML CSS level2 W3C CSS level1 CSS level2.1 UA 100% CSS level3 HTML

11 CSS h1 h1 { color : blue ; } { } : ; 11

12 : 14 : : p { font-size: 14pt; } p { font-style: italic; } p { text-decoration: underline; } p { font-size: 14pt ; font-style: italic; text-decoration: underline; } { : ; : ; : ; } 12

13 h1 { font-style: italic; } p { font-style: italic; } h1, p { font-style: italic; } { : ; } 13

14 (1) (2) head style (3) style 14

15 (1) CSS head link CSS CSS.css HTML <html> <head> <title> </title> <link href= style.css rel= stylesheet type= text/css /> </head> <body> <h1> </h1> <p> </p> </body> </html> style.css h1 { font-style: italic; } p { text-decoration: underline; } CSS 15

16 (2) style head style HTML <html> <head> <title> </title> <style type= text/css > h1 { font-style: italic; } p { text-decoration: underline; } </style> </head> <body> <h1> </h1> <p> </p> </body> </html> 16

17 (3) style style <html> <head> <title> </title> </head> <body> <h1 style= font-style: italic; > </h1> <p style= text-decoration: underline; > </p> </body> </html> 17

18 (1) (2) (3) 18

19 (1) h1 p <head> <style type="text/css"> h1 { color: red; } p { font-style: italic; } </style> </head> <body> <h1> </h1> <p> </p> <p> </p> <p> </p> </body> 19

20 h1 p 20

21 (2) class HTML <p class= note > </p>. CSS p.note { font-style: italic; } (p) note. CSS.note { font-style: italic; } note 21

22 : HTML <p class= red > </p>p.red { color: red; } + CSS p.red { color: blue; } font <font color= red > </font> CSS <p class= remark > </p> 22

23 class id class id class id <p class= note > </p> <ul> <li class= note > </li> <li> </li> </ul> <body> <div id= header > </div> <div id= content > </div> <div id= footer > </div> </body> note, header / Note note 23

24 (3) id id HTML <h1 id= basic-html >HTML </h1> id # # CSS h1#basic-html { color: navy; } #basic-html { color: navy; } (h1) id basic - HTML id 24

25 span div 25

26 span HTML <p>web <span>1989 </span> </p> span HTML span.year { font-style: italic; text-decoration: underline; span class <p>web <span class= year >1989 </span> </p> CSS } + 26

27 div HTML h1 p <h1>web </h1> <p>web 1989 </p> <p>w3c 1994 </p> HTML <div class= section > <h1>web </h1> <p>web 1989 </p> <p>w3c 1994 </p> </div> CSS + div.section { border : dashed 2pt blue; } div 27

28 [CSS ] CSS / etc

29 WEB CSS CSS

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

PowerPoint プレゼンテーション

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

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

Web概論

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

More information

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

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

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

More information

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

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

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

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

CSSの基礎

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

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

SNS 14,917,000,000 10,780,000 SNS 8,850,000,000 14,900,000 MobileSpace 8,000,000,000 3,000,000 SNS 6,000,000,000 6,000,000 3,863,000,000 22,100,000 3,790,000,000 8,970,000 i i 3,500,000,000 6,000,000 2,001,000,000-1,900,000,000

More information

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

2 詳 細 なレイアウトを 記 述 できる HTMLよりレイアウト 記 述 力 が 高 い 例 )テキストや 画 像 を 好 きな 位 置 に 配 置 できる HTMLから レイアウトに 関 する 記 述 を 除 去 で きる HTMLがシンプルに 文 法 間 違 いを 減 らせる 情 報 を 正 1 情 報 基 礎 CSSを 用 いたWebページ 作 成 CSSとは Cascading Style Sheetの 省 略 表 記 シー エスエスと 読 む Webページのレイアウト( 視 覚 的 構 造 )を 定 義 する スタイルシート の 規 格 の 一 つ Webの 標 準 化 団 体 であるW3C(World Wide Web Consortium)によって 標 準 化 現 在 ひろく

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

Taro-CSS.jtd

Taro-CSS.jtd CSSCascading Style Sheet 1. CSS CSSCascading Style Sheet HTML XHTML, XML HTML CSS HTML/XHTML/XML CSS HTMLXHTML CSS XML CSS 2. CSS HTML/XHTML CSS HTML CSS XML XSL-FO XSLT+CSS CSS Web Web HTML 3. HTML HTML

More information

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

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

More information

立ち読みページ

立ち読みページ Chapter 4 4 CSS CSS CSS 69 STEP1 HTML 70 STEP2 79 STEP3 83 STEP4 88 STEP5 94 STEP6 103 STEP7 107 STEP8 ID 108 Chapter 4 1 4 CSS 69 Chapter 4 STEP1 HTML CSS http-equiv"content-style-type"content"text/css"

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

第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

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

PowerPoint Presentation

PowerPoint Presentation HTML5 Level.1 Markup Professional HTML5 Level.2 Application Development Professional http://www.html5exam.jp/ @html5cert https://www.facebook.com/html5exam

More information

http://www-6.ibm.com/jp/software/internet/hpb/download.html b /b br / b /b b /b i /i b i /b i i -1/14-

http://www-6.ibm.com/jp/software/internet/hpb/download.html b /b br / b /b b /b i /i b i /b i i -1/14- http://www-6.ibm.com/jp/software/internet/hpb/download.html b /b br / b /b b /b i /i b i /b i i -1/14- .html.htm html head title /title /head body br /body /html html br -2/14- body -3/14- C: Documents

More information

文 書 構 造 とスタイル

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

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

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

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

More information

コンピュータサイエンス 1. ウェブの基本

コンピュータサイエンス 1. ウェブの基本 1. Chris Plaintail May 18, 2016 1 / 27 1 2 HTML HTML 3 CSS style 2 / 27 HTML HTML HTML HTML CSS HTML CSS 3 / 27 4 / 27 HTML HTML, CSS HTML, CSS http, https file CSS HTML CSS.html PC file:// PC.html 5 /

More information

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

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

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

インターネットマガジン1996年12月号―INTERNET magazine No.23

インターネットマガジン1996年12月号―INTERNET magazine No.23 26 INTERNET magazine 1996/12 HTML S jhttp://www.microsoft.com/truetype/css/gall ery/spec2.htm S jhttp://www.hidaho.com/c/ S jhttp://www.microsoft.com/ie/most/howto/lay out/winston/wclub.htm

More information

スライド 1

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

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

あいち電子自治体ガイドライン(第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

PowerPoint Presentation

PowerPoint Presentation 2 3 4 HTML 5 Level.1 Markup Professional HTML 5 Level.2 Application Development Professional 5 6 7 8 9 http://www.html5exam.jp/ @html5cert https://www.facebook.com/html5exam http://www.pearsonvue.com/japan/registration/

More information

FileList Convert a pdf file!

FileList Convert a pdf file! Tamadaigakufuzokuhijirigaokac yugakukoutougakkoupasocom butamadaigakufuzokuhijirigaok acyugakukoutougakkoupasoco mbutamadaigakufuzokuhijiriga 2009 09 20 21 okacyugakukoutougakkoupaso combutamadaigakufuzokuhijiri

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

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

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

More information

0序文‐1章.indd

0序文‐1章.indd 本 書 に 記 載 されたURL 等 は 執 筆 時 点 でのものであり 予 告 なく 変 更 される 場 合 があります 本 書 の 使 用 ( 本 書 のとおりに 操 作 を 行 う 場 合 を 含 む)により 万 一 直 接 的 間 接 的 に 損 害 が 発 生 し ても 出 版 社 および 著 者 は 一 切 の 責 任 を 負 いかねますので あらかじめご 了 承 下 さい Microsoft

More information

ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3

ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3 Web 2.0 Web Web Web Web Web Web Web I II I ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3 1. 1.1 Web... 1 1.1.1... 3 1.1.2... 3 1.1.3... 4 1.2... 4 I 2 5 2. HTMLCSS 2.1 HTML...

More information

1 1 1............................ 1 2............................ 1 3 Java........................ 2 4........................ 3 2 4 1................

1 1 1............................ 1 2............................ 1 3 Java........................ 2 4........................ 3 2 4 1................ Java 1 1 1............................ 1 2............................ 1 3 Java........................ 2 4........................ 3 2 4 1......................... 4 2.......................... 4 3....................

More information

アイデアマンズ 株 式 会 社 について 2005 年 11 月 設 立 パッケージソフトウェアの 開 発 ケータイキット for Movable Type キャプチャツール WebScan PHP Perlなどによるシステム 開 発 Webサイトの 制 作 2

アイデアマンズ 株 式 会 社 について 2005 年 11 月 設 立 パッケージソフトウェアの 開 発 ケータイキット for Movable Type キャプチャツール WebScan PHP Perlなどによるシステム 開 発 Webサイトの 制 作 2 Movable Typeによるブログの 携 帯 対 応 と イントラブログへの 活 用 2010 年 3 月 15 日 ~WEB 社 内 報 で 情 報 共 有 をもっと 簡 単 に~ アイデアマンズ 株 式 会 社 代 表 取 締 役 宮 永 邦 彦 1 アイデアマンズ 株 式 会 社 について 2005 年 11 月 設 立 パッケージソフトウェアの 開 発 ケータイキット for Movable

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

CSSで書籍組版を

CSSで書籍組版を CSSで 書 籍 組 版 を ( 有 )イー エイド 藤 島 雅 宏 FormatterClub CSS 書 籍 組 版 セミナー 講 演 資 料 開 催 日 2013 年 10 月 18 日 会 場 東 京 都 中 央 区 浜 町 区 民 館 簡 単 そう 易 しい 簡 単 なことしかできない CSSはWeb 用 であり 組 版 機 能 が 劣 る コンテンツはHTMLなので 構 造 が 簡 単

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

ホームページの作成

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

More information

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

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 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 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 Information System Design No.3 Web 文 書 にスタイルを 付 ける Tatsuya Hagino (hagino@sfc.keio.ac.jp) 1 Webページの 構 成 要 素 直 交 技 術 を 組 み 合 わせる 内 容 スタイル プログラミング スタイル プログラミング JavaScript CSS Webページ Web 文 書 HTML 内 容

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

地域と文化資産

地域と文化資産 11 2005 1980 151 20 65 1 6 37 7 A D E F G H - 2 - 2005 8 6 10:00 10:30 2-432 A D 7 E 8 1-F 1-G - 3 - 2005 H 1970 2005 8 26-4 - A B D E F G H 3 7 8 1 5 6 1 10-5 - 2005 10 1 5 6 1 1 30 2 3 5 3 2 1 2005 8

More information

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 http://www.moj.go.jp/press/090130-1.html 55 56 57

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

セレクタ? セレクタ (Selector 選択 指定するもの ) は どのタグにスタイルを付けるのかを指定するためのものです セレクタ { プロパティ : 値 ; どのタグにスタイルを付けるかの指定 { スタイルの設定名 : スタイルの設定値 ; body { color: red; body を選

セレクタ? セレクタ (Selector 選択 指定するもの ) は どのタグにスタイルを付けるのかを指定するためのものです セレクタ { プロパティ : 値 ; どのタグにスタイルを付けるかの指定 { スタイルの設定名 : スタイルの設定値 ; body { color: red; body を選 CSS のセレクタについて 作成日 : 2016/01/25 作成者 : 西村 はじめに CSS では タグを指定するのに セレクタ というものを使います セレクタを覚えておくと スタイルを付ける時に指定したいタグをうまく指定することができるようになります JavaScript(jQuery) でもタグの指定の方法としてセレクタを使うため JavaScript も学びたい方は覚えておくとお得です この文書では

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

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

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

cssnitelp47_hasegawa_v02.key

cssnitelp47_hasegawa_v02.key 本当に利用は必要か デザイナーにとっての jquery と JavaScript フレームワーク HIROMU HASEGAWA " " show hide

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

第3学年    学習指導案

第3学年    学習指導案 Web Page 2 -1- myhome.htm html head title my home page /title /head body Welcome to Sasaki's Home page /body /html myhom e.htm html /htmlhead /headtitle /title body /body myhome.htm -2- myhome.htm body

More information

スライド 1

スライド 1 XPages.JP はこう作られた! - テクテク Lotus 技術者夜会 -(2016 年 6 月 17 日 ) 株式会社エフ御代政彦ケートリック株式会社田付和慶 AGENDA テーマの選定 サイトマップ機能 サンプルAPP ギャラリー機能 管理機能 おまけ テーマの選定 < 選定基準 > 1. XPAGES だなってバレないクールなデザイン 2. フリーのデザインテンプレートから探す 3. Bootstrapを標準で搭載

More information

Section 1 Section 2 Section 3 Section 4 Section 1 Section 3 Section 2 4 5 Section 1 6 7 Section 1 8 9 10 Section 1 11 12 Section 2 13 Section 2 14 Section 2 15 Section 2 16 Section 2 Section 2 17 18 Section

More information

1 48

1 48 Section 2 1 48 Section 2 49 50 1 51 Section 2 1 52 Section 2 1 53 1 2 54 Section 2 3 55 1 4 56 Section 2 5 57 58 2 59 Section 2 60 2 61 Section 2 62 2 63 Section 2 3 64 Section 2 6.72 9.01 5.14 7.41 5.93

More information

- 1 - - 0.5%5 10 10 5 10 1 5 1

- 1 - - 0.5%5 10 10 5 10 1 5 1 - - - 1 - - 0.5%5 10 10 5 10 1 5 1 - 2 - - - - A B A A A B A B B A - 3 - - 100 100 100 - A) ( ) B) A) A B A B 110 A B 13 - 4 - A) 36 - - - 5 - - 1 - 6-1 - 7 - - 8 - Q.15 0% 10% 20% 30% 40% 50% 60% 70%

More information

はじめに 本書の目的は 制作の効率化 クオリティの向上 各作業者間のスタイルの統一を 図る目安になることで 常にブラッシュアップを繰り返し 現時点での最適解の共 有に活用するものである 目次 基本仕様 ファイル ディレクトリ構成 画像ファイル 対応ブラウザ 品質管理 (X)HTML 制作 文字コード

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

More information

3 3.1 SSedit ua012345% ssedit SuperSQL config.ssql log.txt( logs.txt) SSedit SSedit 3.2 ssql Putty SSedit ua012345% ssql HTML /public html/ssql.ssql 4

3 3.1 SSedit ua012345% ssedit SuperSQL config.ssql log.txt( logs.txt) SSedit SSedit 3.2 ssql Putty SSedit ua012345% ssql HTML /public html/ssql.ssql 4 SuperSQL SuperSQL 2016 6 30 1 SuperSQL ITC 2 SuperSQL 2.1 public html/ssql 2.2 SSedit SSedit (3.1 ) postgresql (ua123456 ) 131.113.101.124 /public html/ssql SuperSQL HTML /public html/ssql http://user.keio.ac.jp/

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

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

CSS3

CSS3 オレたち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 information

Cascade Style Sheet

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

More information

.....

..... Peace & Piece Version1.0Peace & Piece 2011/12/17 ..... A-1 CV B-1 C-1 D-1 E-1 F-1 Web G-1 H-1 I-1 J-1 K-1 L-1 M-1 FAQ B-2 D-2 E-2 F-2 H-2 D-3 F-3 CMS () Web Web Web 75 85 Z Web alt SEO SEO Web

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

人芯経営論 ・・・リーダーシップ考②

人芯経営論 ・・・リーダーシップ考② 2009/12/15 2009/11/17 2009/11/16 2009/10/19 2009/10/15 2009/10/1 2009/9/17 2009/9/1 2009/8/17 2009/8/17 2009/8/14 2009/8/12 2009/7/28 2009/7/17 2009/7/15 2009/6/24 2009/6/18 2009/6/15 2009/5/20 2009/5/15

More information

2 1 2 3 3 1 @media screen and (max-width: 48em) { #container { width: 100%; display: -webkit-box; display: -moz-box; display: box; } #nav { -webkit-box-ordinal-group: 3; box-ordinal-group: 3; } #main

More information

この content というものには 幅 や 高 さがあるんですけども CSS でそれを 表 す 時 には こ の content という 物 自 体 を height や wedth という 値 で 表 します なので CSS で 幅 や 高 さを 指 定 するとき content そのものに 対

この content というものには 幅 や 高 さがあるんですけども CSS でそれを 表 す 時 には こ の content という 物 自 体 を height や wedth という 値 で 表 します なので CSS で 幅 や 高 さを 指 定 するとき content そのものに 対 CSS 2 章 はじめに 大 切 なこと2つ ボックスモデル セレクターの 種 類 セレクターの 種 類 はたくさんあるので 覚 えるしかありません ボックスモデルを 理 解 しないと CSS ができません これは 重 要 すぎるほど 重 要 な 部 分 です! 各 html 要 素 には BOX モデルと 言 って 各 部 分 部 分 を 表 すようなものがある 具 体 的 な 図 で 見 ていきましょう

More information

1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1..............................

1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1.............................. 1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1.............................. 4 2.............................. 6 3...........................

More information

1

1 0 1 2 OK NG 3 ID 4 CMS 5 CMS 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 [PDF 7KB] [ ] 22 23 (HP ( pt) ) () ( 24 25 ( ) 26 27 28 29 #() URL # # 30 [PDF 7KB] [ ] 31 32 33 34 35 HTML HTML 36 37 38 39 40

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

_IMv2.key

_IMv2.key 飯島基 文 customb2b@me.com $ ssh ladmin@im.example.com $ cd /Library/Server/Web/Data/Sites/Default/ $ git clone https://github.com/msyk/inter-mediator.git

More information

4-1. html css html 046 11 12 ht tp ht tp html HyperTex t Markup Language: html <meta ht tp - equiv="content-type" content=" tex t /html; charset=utf-

4-1. html css html 046 11 12 ht tp ht tp html HyperTex t Markup Language: html <meta ht tp - equiv=content-type content= tex t /html; charset=utf- 4.html css html css Adobe Flash JavaScript xml Ajax html css 045 11 12 4-1. html css html 046 11 12 ht tp ht tp html HyperTex t Markup Language: html

More information

08.pdf

08.pdf 8 RDFa HTML/XHTML : ISBN: 978-4839931957 : : 2009/5/28 1 Microformats i18n abbr img RDFa RDF XHTML

More information