html6-8

Size: px
Start display at page:

Download "html6-8"

Transcription

1

2 -1-

3 -2-

4 -3-

5 -4-

6 -5-

7 -6-

8 -7-

9 -8-

10 -9-

11 MEMO <em>...</em> Textbook 4-10-

12 MEMO <pre>...</pre> -11-

13 Textbook 3 リスト7-3 break.html Lesson 7 テキストの修飾 こうしたことがありますので たとえウェブエディタ を使う場合でも ある程度HTMLの知識を持っていた 方がよいのです そうすれば 自分でコードを修正し て問題を回避できます H T M Lの知識がまったくなけ れば どう修正してよいかわからないのですから 強制改行 <body> <h1>改行</h1> <p> 俳人小林一茶は生涯に約二万の俳句を残しているそうである 一茶の代表的な句をいくつかあげてみよう <p> 我ときて遊べや親のない雀<br> 痩せ蛙負けるな一茶ここにあり<br> 目出度さもちう位也おらが春<br> </p> </body> </html> CAUTION! ときどきリスト 7-4 のように 改行をするのにいつも < b r > タグを用いているページに出会うことがありま す 図7-4のように表示されますので とくに問題がな いように見えます しかし たとえば 図7-5のように 視力の弱い利用者が文字の大きさを変更したり ブラ ウザウィンドウの大きさを変更したり あるいは画面 の小さな携帯情報端末 PDA などで見たりすると 図7-5のようにおかしなところで改行されていて読みに くく また醜くなってしまいます 困ったことに 一部のウェブページ作成支援アプリ ケーション ウェブエディタ では 設定によって このようなページを平気で作るようになっています したがって ウェブエディタを使って書く場合は で きるだけ多くのブラウザで自分の作ったページを確認 し ウィンドウや文字の大きさを変えてみても意図し た通りに表示されることを確認するようにしてくださ い 図7-4 強制改行の誤用 1 図7-5 強制改行の誤用 2 リスト7-4 break-bad.html 強制改行の誤った使い方 <body> 通学講座ではウェブページ ホームページ に関する文書を翻訳しながら <br> ウェブページの作り方の基本を学びます ホームページの翻訳を仕事として<br> 受注できるのに十分な知識を学びます Webページ作成用の言語であるHTML<br> の基本のほか サウンド 画像 ビデオなどの基礎知識 それにJavaScriptや<br> Javaなどを使って作ったプログラムの簡単な利用法などを学びます </body> </html> 短い引用と長い引用 <cite>と<blockquote> MEMO <cite>...</cite>を使うとテキスト中に埋め込まれた短い引 用を指定できます また <blockquote>...</blockquote> は独立した段落になったブロックの引用に使われます その内容は通常 字下げなどによって 普通のテキスト と区別されます リスト7-5 図7-6 に例を示します < c i t e >タグで囲まれた部分のテキストは 多くのブラ ウザではイタリックで表示されます 日本語では引用 部分は括弧... などを使って表すのが普通です ので 強調の<em>タグの場合と同様 これもちょっと 困ってしまうところです この例にあるように<p>...</p>の中と同様 改行を入れる に は 改 行 タグ < b r > を 使 い ま す じ つ は 図 7-3 の 例 は <blockquote>を用いた方がよかったのです リスト7-5 quote.html 引用 <body> <h1>引用</h1> <p> 俳人小林一茶の句の中で一番有名なのは<cite>痩せ蛙 </cite>の句であろうか しかし 一茶はなんと生涯に 約二万の俳句を残しているそうである 代表的な句を いくつかあげてみよう <blockquote> 我ときて遊べや親のない雀<br> 痩せ蛙負けるな一茶ここにあり<br> 目出度さもちう位也おらが春<br> 我ときて遊べや親のない雀<br> </blockquote> </body> </html> 図7-6 引用 -12 -

14 MEMO < < < > > > " " " & & & &copy é é é ö ö ö MEMO -13-

15 -14-

16 -15-

17 -16-

18 -17-

19 -18-

20 -19-

21 -20-

22 -21-

23 \ \ -22-

24 aj i i j -23-

25 -24-

26 #DED0CF "#DDBCA4" "#DDDBA3" "#DDCCA4" <td><br></td> -25-

27 CAUTION! -26-

28

●70974_100_AC009160_KAPヘ<3099>ーシス自動車約款(11.10).indb

●70974_100_AC009160_KAPヘ<3099>ーシス自動車約款(11.10).indb " # $ % & ' ( ) * +, -. / 0 1 2 3 4 5 6 7 8 9 : ; < = >? @ A B C D E F G H I J K L M N O P Q R S T U V W X Y " # $ % & ' ( ) * + , -. / 0 1 2 3 4 5 6 7 8 9 : ; < = > ? @ A B

More information

14 13 12 11 10 9 8 7 6 5 4 3 2 1 B1 B2 N

14 13 12 11 10 9 8 7 6 5 4 3 2 1 B1 B2 N 14 13 12 11 10 9 8 7 6 5 4 3 2 1 B1 B2 N L B1 K M K 1F 2F 2 j 5 L 3F 4F É 5F 6F 7F 8F & 9F 10F k & 11F 14F 12F 14F 10 13F 12F 1 2 3 11 12 13 15 14 16 4 5 28 17 7 12 6 19 18 27 8 11 10 9 1 2 3 4 5 6 7 8

More information

76

76 ! # % & % & %& %& " $ 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 % & &! & $ & " & $ & # & ' 91 92 $ % $'%! %(% " %(% # &)% & 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 !$!$ "% "%

More information

†ı25”Y„o-PDF.ren

†ı25”Y„o-PDF.ren 12,000 10,000 8,000 6,000 4,000 2,000 0 1998 1999 2000 2001 2002 2003 2004 1,200 1,000 800 600 400 200 0 1998 1999 2000 2001 2002 2003 2004 $ "! ''" '' ''$ ''% ''& '''! " ' & % $ "! ''" ' '$ '% '& ''!

More information

医師国家資格試験出題基準(平成17年版)

医師国家資格試験出題基準(平成17年版) ü é é ö ! éè é ö ö é ö ö ö ö ! é ! ! !! !! !! ! ! ! ! ! ! ! !! !! !! " !! !!!!!!! !!!!! ! "! !!!!!

More information

1/2

1/2 札幌学院大学社会情報学部課題用テキスト (2) 1 札幌学院大学社会情報学部課題用テキスト HTML の基礎知識 (2) 1 画像の表示 HP に画像を表示させてみる まず HTML 文書と同じフォルダ内 に JPEG ファイル ( 拡張子.jpg ) を 1 個準備する ( 画像の作り方 サイズの調べ方はこのプリントの最後を参照 ) この画像を読みこんで表示するためのタグは以下の通りである 画像ファイル名と

More information

- 1 - - 2 - 320 421 928 1115 12 8 116 124 2 7 4 5 428 515 530 624 921 1115 1-3 - 100 250-4 - - 5 - - 6 - - 7 - - 8 - - 9 - & & - 11 - - 12 - GT GT - 13 - GT - 14 - - 15 - - 16 - - 17 - - 18 - - 19 - -

More information

’¸’_Ł\”ƒ1-4fiñŒÊ

’¸’_Ł\”ƒ1-4fiñŒÊ 20 23 2011 1 23 24 10 2010 26 11 20 27 12 29 13 22 35 14 2010 36 15 44 23 3 11 23 27 1 11 46 14 188 14 2 16 22 97 3 2 7 3 30 80 19 22 10 1 37 796 4 3 20 30 30 23 3 30 19 4 1 4 8 1 2 4 5 2010 73 22 7 19

More information

Digital Series DS-00 5 6 5 P.7 5 P. 5 6 6 P.09 P.8 7 P.5 P.8 P.80 8 9 P. P. P.09 P.7 P. P.5 P.0 P.9 P.7 0 P.9 P. P.79 P.6 P.5 P.8 P.6 5 6 P. 7 P.9P. 8 P. 6 5 P.7 9 5 6 P. 0 6 5 P.7 5 6 P. 5 P.9 P.

More information

Microsoft PowerPoint - InfPro_I9.pptx

Microsoft PowerPoint - InfPro_I9.pptx 今 日 の 学 習 内 容 エディタ(emacs)を 使 った 基 本 的 なHTML の 書 き 方 Webページの 公 開 HTMLの 基 礎 知 識 HTML(Hyper Text Markup Language)は Webページを 作 るための 必 要 な 記 述 言 語 HTMLにおける 指 定 の 内 容 は: 1. 文 章 (テキスト)に 対 する 役 割 2. 文 章 やイメージなどのページ

More information

◎phpapi.indd

◎phpapi.indd PHP や HTML の知識がなくても大丈夫 PHP や HTML の基本も学べる FileMaker データベースを Web に公開したい FileMaker を使って動的な Web サイトを作りたい FileMaker しか知らない人が Web アプリケーションを作れるようになる! はじめに まず 本書を手に取ってくださりありがとうございます 本書はある程度 FileMaker Pro の扱いに慣れ

More information

HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:<...>で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd 他 に loose.dtd,frameset.d

HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:<...>で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd 他 に loose.dtd,frameset.d 第 10 回 HTMLの の 基 礎 HTMLとは 作 成 手 順 基 本 形 改 行 と 段 落 整 形 済 みテキスト 横 線 見 出 し リスト1(UL,OL) リスト2(DL) インライン 画 像 リンク HTMLとは HyperText Markup Language ハイパーテキスト:テキストを 超 えたもの マークアップ:で 指 示 する 規 格 厳 密 には htttp://www.w3.org/tr/html4/strict.dtd

More information

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

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

More information

Lecture/CompPracR2003/12th

Lecture/CompPracR2003/12th Lecture/CompPracR2003/12th 2016 年 7 月 17 日 コンピュータ 演 習 ( 再 ) 第 12 回 (1) Webページの 作 成 (1) Webページを 作 成 する 道 具 (1) テキストエディタを 使 うメリット デメリット (2) HTML (2) HTMLとは (2) HTMLの 書 き 方 (3) HTMLファイルの 構 造 (3) 空 白 と 改 行

More information

1/2

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

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション "# "# $%&' "#$% $# & $# $% % ' ()(*"#$% +,(- ()(*"#$%.' ()(* $/.0##'' %0$&0% 1*2#/0/%'&0343$56 789#/0/'%&04../ "3"0##"$ "0%0$" "7 1*2#.30///04%.$ 789#.30///0#$'4 http://www.ibie2016.com/exhibitorlist/

More information

第21章 表計算

第21章 表計算 第 3 部 第 3 章 Web サイトの作成 3.3.1 WEB ページ作成ソフト Dreamweaver の基本操作 Web ページは HTML CSS という言語で作成されており これらは一般的なテキストエディタで作成できるのが特徴ですが その入 力 編集は時に煩雑なものです そこで それらの入力 編集作業など Web ページの作成を補助するソフトウェアである Dreamweaver の使い方について解説していきます

More information

7310_J_Print.qxd

7310_J_Print.qxd J 1 2 3 4 4 5 6 7 8 9 1 2 3 4 5 6 7 8 9 10 1 2 3 4 5 6 7 8 9 10 1 2 3 1 2 3 1 2 1 2 3 1 2 3 1 2 3 1 2 3 1 2 3 1 2 1 2 1 2 1 2 1 2 3 1 2 3 1 1 2 2 1 2 3 4 1 H P C 1 2 3 4 1 2 1 2 1 2 1 2 3 4 1

More information

OM_J_MFS2B_3.5B_body_CS_151023N.indd

OM_J_MFS2B_3.5B_body_CS_151023N.indd 1 2 13 14 25 26 3 15 27 4 5 16 17 28 6 18 7 8 19 20 9 21 10 11 22 23 12 24 1. 2. 5. 3. 4. !!! 1. 2. 1. 2. 1. !!!! 1. 2. 1. 1. 2. 3.! 1. 2. 3. !! !!!! 1. 2. 1. 2. 1. !!!!! 1. 1. 1.! 1. 2. 3. 1. 1. 2.!

More information

0120-37-2269 0120-78-2269

0120-37-2269 0120-78-2269 0120-37-2269 0120-78-2269 1 2 3 4 Memo

More information

0120-37-2269 0120-78-2269 1 2 3 4 Memo Memo

More information

1

1 1 3 2 5 4 7 6 8 9 11 10 12 13 14 15 16 17 19 18 20 21 23 22 25 24 27 26 29 28 31 30 33 32 35 34 37 36 39 38 40 41 43 42 45 44 46 47 49 48 51 50 52 53 55 54 57 56 59 58 60 61 63 62 64 65 67 66 68 69 70

More information

0120-37-2269 0120-78-2269

0120-37-2269 0120-78-2269 0120-37-2269 0120-78-2269 1 2 3 4 Memo

More information

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 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71

More information

財政金融統計月報第720号

財政金融統計月報第720号 ! # " $ % &! # % " $ &! # % " $ &! # %! # % " $ & " $ &! # % " $ & !!!!!!! !!!!!!! ! # " $ ! # " $ ! " # $! " # $ ! # " $ ! # $& %" !

More information

数のディジタル化

数のディジタル化 第 3 章コミュニケーションとネットワークを探索する 4 節コミュニケーションとネットワークの活用 4 節コミュニケーションとネットワークの活用 3 コミュニケーションツールの活用 第 3 章 4 節コミュニケーションとネットワークの活用 コミュニケーションツールの活用 本日の内容 第 3 章コミュニケーションとネットワークを探索する 4 節コミュニケーションとネットワークの活用 3. コミュニケーションツールの活用

More information

... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2

... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2 1 ... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2 3 4 5 6 7 8 9 Excel2007 10 Excel2007 11 12 13 - 14 15 16 17 18 19 20 21 22 Excel2007

More information

prg.indb

prg.indb II HTML Web HTML HTML 章 Webコンテンツは主に HTMLで書かれます 部 体験編 Ⅱ HTMLってなに Web コンテンツを制作するときには HTML と呼ばれる形式でドキュメント 文 書 を記述するのが一般的です HTML は Hyper Text Markup Language の略称 であり テキスト 文書 を記述するための 言語 の一種です HTMLドキュメント は

More information

JavaプログラミングⅠ

JavaプログラミングⅠ Java プログラミング Ⅰ 2 回目 ようこそ Java へ 今日の講義で学ぶ内容 画面へのメッセージの表示 文字や文字列 数値を表現するリテラル 制御コードを表すエスケープシーケンス 画面出力の基本形 ソースファイル名 : クラス名.java class クラス名 System.out.println(" ここに出力したい文字列 1 行目 "); System.out.println(" ここに出力したい文字列

More information

-----------------------------------------------------------------------------------------1 --------------------------------------------------------------------------------------1 -------------------------------------------------------------------------------------1

More information

›¼’à”v“lŠÍ1−ª

›¼’à”v“lŠÍ1−ª 3 1 1 2 3 4 5 6 7 8 8 10 12 14 16 18 20 22 24 2 1 2 3 4 5 6 7 8 9 10 11 12 26 28 30 32 34 36 38 40 42 44 46 48 50 4 3 1 2 3 4 5 52 54 56 58 60 6 62 7 8 9 10 64 66 68 70 72 5 1 1 4 2 5 6 6 7 1 8 1 9 2 10

More information

1 2 3 4 1 2 3 4 1 2 3 4 12 3 4

1 2 3 4 1 2 3 4 1 2 3 4 12 3 4 1 2 3 4 5 6 1 2 3 4 5 6 1 2 1 2 1 2 1 2 1 2 3 4 12 3 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 12 3 4 1 2 3 4 5 6 7 8 1 2 3 46 7 1 2 3 4 5 6 7 1 2 3 4 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 16 7 8 92 3 46 7 :

More information

- 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 - 11 2-12 - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 1 - 2 - 3 6 1 1-4 - 5 - 6 - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 130 3 130 5 2 50 1.5 48 59 62 63-9 - 1 - 2 - 3 () - 4 - 5 -

More information