Upload
ledung
View
223
Download
0
Embed Size (px)
Citation preview
コンピュータ演習Ⅰ Java クラス 課題5
1 / 4
1.表の作成方法
表を作成するには、テーブル要素を設定します。テーブル要素には、表全体の領域を指定する table
要素、表内の行を作成する tr 要素、行を区切るセルを作成する td 要素を組み合わせて、使用す
る
行を区切るセルのうち、見出しとして使用するセルには th 要素を使う
テーブル要素(table 要素、tr 要素、th 要素、td 要素)
table 要素の属性
属性名 概要 値
border 表の枠線の太さを指定する px(ピクセル)で指定
cellspacing セルとセルとの間隔を指定する px(ピクセル)、または%で指定
cellpadding セル内の余白を指定する px(ピクセル)、または%で指定
2.テーブル要素の設定(課題)
(1) ブラウザで「company.html」を開き、
サンプルの Web ページを確認する
(2) メモ帳で「company.html」を開く
テーブル要素
<table border="値" cellspacing="値" cellpadding="値">
<tr>
<th>見出し 1</th>
<th>見出し 2</th>
</tr>
<tr>
<td>内容 1</td>
<td>内容 2</td>
</tr>
</table>
border
cellspacing
cellpadding
コンピュータ演習Ⅰ Java クラス 課題5
2 / 4
(3) table 要素を設定する
border 1px
cellspacing 5px
cellpadding 10px
(4) タグの入力が終わったら、上書き保存をする
(5) ブラウザを更新する
表が作成された
コンピュータ演習Ⅰ Java クラス 課題5
3 / 4
3.画像要素の記述方法
使用できる画像の種類
ファイルの種類 拡張子 特徴
GIF 形式 .gif 使用できる色数は 256 色まで。単純なイラストや色数の
少ないアイコンなどの画像に向いている。透過 GIF とい
う機能で、画像中の特定の色を透明にして保存できる。
JPEG 形式 .jpeg (.jpg) 使用できる色数は 1677 色。グラデーションのあるイラス
トや写真などに向いている。透明化はできない。
PNG 形式 .png 使用できる色数は 1677 色。単純なイラストから写真まで
さまざまな画像に向いている。透明化もできる。
画像要素 (img 要素)
img 要素の属性
属性名 概要 値
src(必須) 画像ファイルを指定する URI で指定
alt 画像の代替テキストを指定する テキストで指定
height 画像の高さを指定する px(ピクセル)または%で指定
width 画像の幅を指定する px(ピクセル)または%で指定
※画像要素は内容を持たない。終了タグもない
画像要素
<img src="値" alt="値" height="値" width="値">
コンピュータ演習Ⅰ Java クラス 課題5
4 / 4
4.画像の挿入(課題)
(1) メモ帳で「company.html」を開く
(2) img 要素を設定する
画像ファイル名 map.png
代替テキスト 地図
(3) タグの入力が終わったら、
上書き保存をする
(4) ブラウザを更新する
画像が挿入された