ウェブ練習

私のホームページを作成して9年目に入りました。この機会に私のページの構成を書き出し、書き方を記録して、失念しないように、このページを作ってみようと思います。このページ（"https://www.yamanotanbo.jp/index.html"）を教科書にして、私のページの体裁をそのまま再現していただけるなら、歓迎し、うれしく思います⇒このページ


◇リンク一覧◇
⇒HOME
⇒自分で作ってみよう1；テレビ置き台
⇒自分で作ってみよう2；CD収納庫
⇒自分で作ってみよう3；カメラディスプレイ
⇒自分で作ってみよう4；コンポ置き台
⇒自分で作ってみよう5；LEDスタンド
⇒自分で作ってみよう6；実績LIST（リスト）
⇒自分で作ってみよう7；TOOL＆MATERIAL（工具＆材料）
⇒自分でやってみよう1；WEB PAGE STUDY（ウェブ道を歩こう）
⇒自分でやってみよう2；GARDENING（植栽管理）
⇒自分でやってみよう2；GARDENING2（植栽管理2）
⇒自分でやってみよう3；HOUSE CLEANING（家の清掃）
⇒自分でやってみよう4；HOUSE MAINTENANCE（家の保全）
⇒自分でやってみよう5；TRAVEL（旅行）
⇒自分でやってみよう5；TRAVEL2（旅行2）
⇒自分でやってみよう6；RADIO CONTROL（ラジコン）
⇒自分でやってみよう7；WALKING（ウォーキング）
⇒自分でやってみよう7；WALKING2（ウォーキング2）
⇒自分でやってみよう8；MY PC HISTORY（私のパソコン歴）
⇒自分でやってみよう9；MY FOREIGN LANGUAGE （私の外国語歴）
⇒自分でやってみよう10；MY CAR HISTORY（私の自家用車歴）
⇒自分でやってみよう11；VIDEO & CAMERA（ビデオ＆カメラ）
⇒自分でやってみよう12；POWER SAVING（節電）
⇒自分でやってみよう13；MY EVENT（私の出来事）
⇒自分でやってみよう14；MY THOUGHTS（私の雑感）
⇒自分でやってみよう15；STOCKTAKING（商品箱の棚卸）
⇒自分でやってみよう16；ENJOY AUDIO （オーディオ機器を楽しもう）
⇒自分でやってみよう17；ENJOY WATCH （時計を楽しもう）
⇒自分でやってみよう18；ENJOY CONTROL（管理学を実践しよう）
⇒恵那峡トレッキング；ENJOY TREKKING（トレッキングを楽しもう）
⇒自分でやってみよう19；STUDY MANSION CONTROL(管理員学を実践しよう)
⇒自分でやってみよう20；STUDY AUTOCAD(オートキャドを会得しよう)
⇒自分でやってみよう21；HP ANNIVERSARY(ホームページ開設一周年)
⇒やってみました海外生活；OVERSEAS LIFE(海外生活体験談)
⇒ハウスクリーニング学＆納屋理論；STUDY HOUSE CLEANING(ハウスクリーニング学を実践しよう)
⇒こんな商品を買いたい；STUDY NEW GOODS（新商品を研究しよう）
⇒私見自制学集；MY OPINION（恐れながら申し上げます）
⇒私のエンタメ体験史；MY HISTORY OF EXPERIENCE ON ENTERTAINMENT（私のエンタメ体験を振り返ります）
⇒車体小僧；MY HISTORY OF EXPERIENCE ON BODY SHOP（私の車体小僧振りを振り返ります）
⇒私は"お掃じいじ"です；MY HISTORY OF EXPERIENCE ON HOUSE CLEANING（お掃除のエキスパートを目指している"じいじ"です）
⇒自分でやってみよう22；A 3RD-YEAR STUDENT STUDYING WEBDOU（私はウエブ道を歩んでいる三回生です）
⇒言わせて一言；何もできないので；LET ME JUST SAY ONE THING　（私に一言言わせてください）
⇒ゆふいんの森5号で由布院に行ってきました；WE VISITED YUHUIN BY YUHUIN NO MORI 5 GOU　
⇒私のステップアップ物語；MY STEP UP STORY　
⇒私のパスポート物語；MY PASSPORT STORY　
⇒私のインターネット物語；MY INTERNET STORY　
⇒自分でやってみよう23；A 4TH-YEAR STUDENT STUDYING WEBDOU（私はウエブ道を歩んでいる四回生です）
⇒自分でやってみよう24；TRY MEASURES TO PREVENT DISASTERS（防災を考えよう）
⇒山の田んぼに行く道；ACCESS TO THE RICE FIELDS IN THE MOUNTAIN
⇒ふるさとウォーク；WALKING HOME
⇒錦帯橋ウォーク；WALKING KINTAIKYO
⇒塔ノ沢の初冬；TOUNOSAWA IN EARLY WINTER
⇒湯河原梅林散策；WALKING AROUND YUGAWARA-BAIRIN
⇒スケッチブックに夢を描く;DREAMS ON THE SKETCHBOOK
⇒新神戸駅で下車しました;WALKING AFTER GETTING OFF AT SHIN-KOBE STATION
⇒松山・高知に行ってきました;I WENT TO MATSUYAMA AND KOCHI
⇒修善寺駅で下車しました;WALKING AFTER GETTING OFF AT SHUZENJI STATION
⇒自分でやってみよう25；MOVING SERVER（サーバをかえてみよう）
⇒伊豆クレイルで伊豆急下田駅に行ってきました; WE VISITED IZUKYU-SHIMODA STATION BY IZU CRAILE
⇒自分でやってみよう26；HISTORY OF MY WORKING TO NURSE ELDERLY PERSON（私の介護史をまとめてみました）
⇒近江八幡に行ってきました;WE VISITED OMIHACHIMAN
⇒生涯賃金をみてみよう;LET'S CHECK THE LIFETIME WAGES
⇒アジサイのライフサイクルをみてみよう;LET'S MONITOR LIFE CYCLE OF AJISAI
⇒私の病院・医院遍歴;LET'S OPEN THE DOORS OF MY HOSPITAL・CLINIC RECORDS
⇒自分でやってみよう27; KANRIINDO IS ALREADY DONE（管理員道を実践してみました）
⇒自分でやってみよう28; RENTING SERVER（サーバを借りてみよう）
⇒周防富士ウォーク；WALKING SUOFUJI（周防富士周辺を散策します）
⇒箱根登山電車に乗ってみました；I TOOK THE HAKONETOZAN DENSYA （車窓の景色を撮影しました）
⇒学窓追想；I REMEMBER SCHOOLDAYS（学校時代を振り返ってみました）
⇒クエルナバカ追想；I REMEMBER THE PERIOD AT CUERNAVACA（クエルナバカ出張時代を振り返ってみました）
⇒メルボルン追想；I REMEMBER THE PERIOD AT MELBOURNE（メルボルン出向時代を振り返ってみました）
⇒ウェブ追想；I REMEMBER MY WEB_HISTORY（私のウェブの歴史を振り返ってみました）
⇒山の田んぼ追想；I REMEMBER YAMANOTANBO（山の田んぼを振り返ってみました）
⇒私の精選十大危機；MY SELECTED 10 CRISES（私の十大危機を精選してみました）
⇒ウェブ練習；MY WEB EXERCISE（私のウェブを練習します）
⇒私の地震対策；MY EARTHQUAKE COUNTERMEASURES（私は地震対策を考えています）
⇒コロナ緊急事態宣言；A STATE OF EMERGENCY WAS ANNOUNCED ON CORONA（コロナ緊急事態宣言が発令されました）
⇒瀬戸内散策；WALKING SETOUCHI（瀬戸内海周辺を散策します）
⇒名古屋駅スタート旅；TRIP FROM NAGOYA STATION（名古屋駅起点の旅をしました）
⇒名古屋駅スタート旅；TRIP FROM NAGOYA STATION（名古屋駅起点の旅をしました）
⇒嵯峨嵐山駅で下車しました；WALKING AFTER GETTING OFF AT SAGAARASHIYAMA STATION（貴重な秋の一日でした）
⇒自分でやってみよう14；MY THOUGHTS2（私の雑感2）
⇒自分でやってみよう13；MY EVENT2（私の出来事2）
⇒自分でやってみよう2；GARDENING3（植栽管理3）
⇒自分でやってみよう2；GARDENING4（植栽管理4）
⇒私見自制学集2；MY OPINION2（恐れながら申し上げます2）
⇒自分でやってみよう29；HOW TO MAKE PICTURES AND VIDEOS（静止画、動画の作り方）
⇒シラチャ追想；I REMEMBER THE PERIOD AT SRIRACHA,THAILAND（シラチャの生活を想い出してみました）
⇒地球規模フライト奮闘記；THE WORLD WIDE FLIGHT NOTES（地球規模のフライト奮闘経験を記します）
⇒フィリピン追想；I REMEMBER THE PERIOD AT THE PHILIPPINES（フィリピン時代を想い出してみました）
⇒熱海梅園追想；I REMEMBER THE ATAMIBAIEN（熱海梅園を想い出してみました）
⇒安曇野追想；I REMEMBER THE ADUMINO（安曇野を想い出してみました）
⇒飛騨高山追想；I REMEMBER THE HIDATAKAYAMA（飛騨高山を想い出してみました）
⇒ギリシャ追想；I REMEMBER THE GREECE（ギリシャを想い出してみました）
⇒フランス追想；I REMEMBER THE FRANCE（フランスを想い出してみました）
⇒平生追想；I REMEMBER THE HIRAO（平生を想い出してみました）
⇒機械工学科追想；I REMEMBER THE DEPARTMENT OF MECHANICAL ENGINEERING（機械工学科を想い出してみました）
⇒箱入り収集品追想；I REMEMBER THE BOXED COLLECTIONS（箱入り収集品を想い出してみました）
⇒皐月庭追想；I REMEMBER MY GARDEN IN MAY（皐月庭を想い出してみました）
⇒自分でやってみよう14；MY THOUGHTS3（私の雑感3）
⇒自分でやってみよう14；MY THOUGHTS4（私の雑感4）
⇒自分でやってみよう14；MY THOUGHTS5（私の雑感5）
⇒ガーデン日記季節雑感；DIARY ON MY GARDEN OF SEASONS（ガーデンの様子を書き綴ってみます）
⇒自分でやってみよう30；ACTION FOR POWER SUPPLY SHORTAGE（電力不足を考えてみました）
⇒退職後のマイライフを楽しもう；ENJOYING MY LIFE AFTER RETIREMENT（無職三昧）
⇒やったね体験談；EXPERIENCES OF GOOD JOB（やったね体験談をリストアップしてみます）
⇒水無月庭追想；I REMEMBER MY GARDEN IN JUNE（水無月庭を想い出してみました）
⇒文月庭追想；I REMEMBER MY GARDEN IN JULY（文月庭を想い出してみました）
⇒葉月庭追想；I REMEMBER MY GARDEN IN AUGUST（葉月庭を想い出してみました）
⇒原発談；MY OPINION ON NUCLEAR POWER PLANT（原発について真剣に考えてみました）
⇒長月庭追想；I REMEMBER MY GARDEN IN SEPTEMBER（長月庭を想い出してみました）
⇒神無月庭追想；I REMEMBER MY GARDEN IN OCTOBER（神無月庭を想い出してみました）
⇒霜月庭追想；I REMEMBER MY GARDEN IN NOVEMBER（霜月庭を想い出してみました）
⇒養老の滝旅追想；I REMEMBER YOUROUNOTAKITABI（養老の滝旅を想い出してみました）
⇒師走庭追想；I REMEMBER MY GARDEN IN DECEMBER（師走庭を想い出してみました）
⇒睦月庭追想；I REMEMBER MY GARDEN IN JANUARY（睦月庭を想い出してみました）
⇒如月庭追想；I REMEMBER MY GARDEN IN FEBRUARY（如月庭を想い出してみました）
⇒弥生庭追想；I REMEMBER MY GARDEN IN MARCH（弥生庭を想い出してみました）
⇒卯月庭追想；I REMEMBER MY GARDEN IN APRIL（卯月庭を想い出してみました）
⇒1800日のロスタイム；1800 DAYS LOST TIME（1800日の老後生活をロスしました）

◇動画収集◇
**ウェブ練習_000；
ヒマワリ畑に会いました；動画ファイル（MP4）
ヒマワリ畑に会いました
⇒戻る

ウェブを書き込む手順をまとめ、記憶に留めておきたいと思います

ウェブ練習目次

09.ウェブ練習序章
1.ウェブ構成上の要件,「Block A」表題、
2.「Block B」ウェブ上のリンク先
3.「Block C」本ページの動画紹介
4.「Block D」サブ表題
5.「Block E,F,G」サブ表題の装飾画像1，2，3
6.「Block H」ホームページのアイテムご案内
7.「Block I」本ページの主題1
8.「Block J」本ページの主題2
9.「Block K」本ページの主題3
10.「Block L,M,N」本ページ主題4　画像1，2，3，4
11.「Block O,P」本ページ主題5　
12.css sheet のご案内　
13.ウェブ関連サイトへのご案内
000.「ウェブ練習」雑感PDF

09．ウェブ練習序章

ウェブページを作成する時、コピーをするのが通例になっていましたので、九年目になるに際して、基本をおさらいしてみようと思いました。記憶を取り戻すことが目的ですが、新しい発見もあるのではと期待もあります
　ウェブページを各ブロックに分けて、記入の仕方について、説明いたします。ブロックはAからQに示しました。私のページは全てブロックに分けて、カラーで区別しています

ウェブページのブロック化

ブロック化

1. ウェブ構成上の要件、「Block A」表題

ウェブページを作成するために、ウェブページであることの宣言が必要とのことで、この章は、その出だしに書き込む内容をご案内いたします

1 　＜HTML＞
　　ウェブページであることを宣言します
2 　＜HEAD＞
　　 ウェブ構成上の要件であることを宣言します
3 　＜TITLE＞表題を記入します＜/TITLE＞
4 　＜BASE ref=https://www.yamanotanbo.jp/＞＜!--京--＞
　　このウェブページはyamanotanbo.jpであることを宣言します
5 　＜META http-equiv=Content-Type content="text/html;charset-euc-jp"＞
　　そのまま記入しておきます
6 　＜meta name-"description"content="表題を記入します"＞
7,8,9,10 　＜meta name=keywords"content="このページのkeywordを記入します。検索エンジンにキャッチされ易くなるそうです">
11 　＜LINK href="https://www.yamanotanbo.jp/NewFolder/base15.css"
12 　 rel=stylesheet type=text/css＞
　　このページの体裁を整えるcss style sheet にリンクしていることを述べています。
　　　またsheetの保管場所を示しています
13 　＜BASE href=https://www.yamanotanbo.jp/＞
　　このまま記入します
14 　＜/HEAD>
　　構成上の要件を終了します。上記はウェブ上には出現しません。ただし、タイトルは出現します

ウェブ構成上の要件

ウェブ構成上の要件

「Block A」表題を記入します


1 　＜div id="page"＞
　　divのコマンドを使用し、このページを表します
2 　＜BODY＞
　　このページ本文を表します
3 　＜CENTER＞
　　左右で中央を指示します
4 　＜TABLE widfh=1200 border=1 bgcolor=#87CEEB style="color:white"＞
　　この「Block A」の区画で、サイズが左右で
　　1200を表します。この区画の区画線の大きさを表します。背景色を指示します。文字の色、白を表します
5 　＜TBODY＞
　　区画開始のルーティーンです
6 　＜TR＞
　　区画開始のルーティーンです
7 　＜TD＞＜SECTION id=a01＞＜hr size="3"＞
　　区画開始のルーティーンです。このページの戻る位置を示します。
　　　下記表題を挟む飾り線と、飾り線の幅を示します
8 　＜h1＞自分で作ってみよう　HOME＜/h1＞
　　表題を記入します。文字の大きさを示します
9 　＜h3 style="color:yellow"＞
　　下記の文字の大きさ、文字色を示します
10 　　今までの私の経験を振り返って、自分で作てみよう、自分でやってみようにまとめてーーー
11 　した。今までのところ、30アイテム以上になりました。今後アイテムが増えて行けばと願ーー
12 　ています。現在進行形のアイテムも含まれており、その都度アップディトいたします
13 　＜/h3＞＜/SECTION＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　区画を閉じるルーティーンです

「Block

KEY WORDS
1. ウェブ構成上の要件
2. 「Block A」表題

2. 「Block B」ウェブ上のリンク先

ページ左側にこのホームページのリンク先を表示しています


1　　＜div id="main"＞
　　divのコマンド（ページ左右の占める位置）を使用しこの位置をmainと決めました
2　　＜TABLE width="350" class="s11" bgcolor=#FFFFFF"＞
　　幅350の区画であるTABLEのコマンドを使用します。
　　文字の大きさを"s11"とします。背景色を#FFFFFFとします
3　　＜TBODY＞
　　区画を使用するコマンドです
4　　＜tr＞
　　区画を使用するコマンドです　
5　　＜td style="color:cadetblue"＞＜br＞◇リンク一覧◇
　　区画を使用するコマンドです。文字色をcadetblueとします。
　　　＜br＞は行替えのコマンドです。リンク一覧と表記します
6　　＜/td＞＜/tr＞
　　行を終了するコマンドです
7　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/index.html"＞⇒HOME＜/a＞＜/td＞＜/tr＞
　　ホームページの基地となる（HOME）
　　ページ/index.htmlに導くリンクコマンドです
8　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/television.html"＞⇒自分で作ってみよう
9　　；テレビ置き台＜/a＞＜/td＞＜/tr＞
　　television.htmlに導くリンクコマンドです
10　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/cdstore.html"＞⇒自分で作ってみよう2；
11　　CD収納庫＜/a＞＜/td＞＜/tr＞
　　cdstore,htmlに導くコマンドです　　
12　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/camera.html"＞⇒自分で作ってみよう　13　　；カメラディスプレイ
13　　＜/a＞＜/td＞＜/tr＞
　　camera.htmlに導くコマンドです
14　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/composition.html"＞⇒自分で作ってみよう　4；コンポ置き台
15　　＜/a＞＜/td＞＜/tr＞
　　composition.htmlに導くコマンドです
16　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/ledstand.html"＞⇒自分で作ってみよう
17　　；LEDスタンド＜/a＞＜/td＞＜/tr＞
　　ledstand.htmlに導くコマンドです
18　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/webtsuisou.html"＞⇒ウェブ追想；I REMEMBER MY WEB_HISTORY　（私の
19　　ウェブの歴史を振り返ってみました）
20　　＜/a＞＜/td＞＜/tr＞
　　webtsuisou.htmlに導くコマンドです
21　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/saihou.html"＞⇒山の田んぼ追想；
22　　I REMEMBER YAMANOTANBO（山の田んぼを振り返ってみました）＜/a＞＜/td＞＜/tr＞
　　saihou.htmlに導くコマンドです
23　　＜tr＞＜td＞＜a href="https://yamanotanbo.jp/crisis.html"＞⇒私の精選十大危機；
24　　MY SELECTED 10 CRISES（私の十大危機を精選してみました）＜/a＞＜/td＞＜/tr＞
　　crisis.htmlに導くコマンドです

「Block B」ウェブ上のリンク先

ウェブ上のリンク先

KEY WORDS
1. 区画を使用するコマンド
2. ホームページの基地となるindex.html
3. 行替えコマンド

3. 「Block C」本ページの動画紹介

ブロックBの下側にそれぞれのページで記載された動画をご案内しています


1　　＜tr＞＜td style="color:cadetblue"＞＜br＞◇動画収集◇＜/td＞＜/tr＞
　　ブロックBからの続きで行を変えるコマンドの実行。
　　文字色はcadetblue
2　　＜tr＞＜td＞
　　行替えのコマンドの実行
3　　＜a href="https://www.yamanotanbo.jp/videos/0020014.MP4＞**自分で作ってみよう！001；＜br＞テレビ置台を作りました；動　
4　　画ファイル（MP4）＜/a＞
　　動画ファイルの実行のコマンド
5　　＜BR＞＜FIGURE align="center"＞＜IMG style="WIDTH:150px;HEIGHT:105px
6　　"src="https://www.yamanotanbo.jp/photo_index/DSC02697.JPG" alt=テレビ置台
7　　＞＜/FIGURE＞＜/td＞＜/tr＞
　　画像表示のコマンドの実行。画像の左右の位置センター指定、画像の大きさの指示
8　　＜tr＞＜td＞＜a href="https://www.yamanotanbo.jp/videos/0020370.MP4"＞**自分で作ってみよう！＿002；＜br＞ヒマワリ畑に
9　　出会いました；動画ファイル(MP4)＜/a＞
　　動画ファイルの実行のコマンド
10　　＜BR＞＜FIGURE align="center"＞＜IMG style="WIDTH:150px;HEIGHT:105px" 　
11　　src="https://www.yamanotanbo.jp/photo_walking/DSC02499.JPG"　alt=ヒマワリ畑に　　
12　　会いました＞＜/FIGURE＞＜/td＞＜/tr＞
　　静止画表示のコマンドの実行、画像左右位置センターの指示、画像の大きさの指示
13　　＜tr＞＜td＞＜a href="index.html #a01"＞⇒戻る＜/td＞＜/tr＞＜/TBODY＞＜/TABLE＞
　　トップに戻るの指示
14　　＜/div＞
　　div コマンドの終了の宣言

「Block C」本ページの動画紹介

本ページの動画紹介

KEY WORDS
1. 動画収集
2. 動画ファイル
3. ヒマワリ畑

4. 「Block D」サブ表題

表題を説明するブロックを設定しております


1　　＜div id="sub"＞
　　divのコマンド（左右配置で右側）を使用し、サブと宣言します
2　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white"＞
　　区画のコマンドを使用します。区画幅は850とします。
　　背景色は#8B008Bとします。文字色は白とします
3　　＜TBODY＞
　　区画に入るコマンドです
4　　＜TR＞＜TD class="sample1"＞
　　区画に入るコマンドです。区画はcssシートで規定されているメインメニューのsample 1とします
5　　＜br＞＜h2＞自分で作ってみよう　HOME＜/h2＞
　　段替えをします。自分で作ってみよう　ホームページのベースの名前です
6　　＜h2 style="color:yellow"＞私の願い；　
　　文字色はyellowとします
7　　＜br＞　
　　段替えをします
8　　世界が平和でありますように
9　　＜br＞　
　　段替えをします
10　　拉致問題が早期に解決されますように
11　　＜br＞　
　　段替えをします
12　　新型コロナウイルスが収束されますように＜/h2＞
　　文章を終了します
13　　＜/TD＞＜/TR＞＜/TBODY＞＜/TBODY＞　
　　区画を閉じるコマンドです

「Block D」サブ表題

サブ表題

KEY WORDS
1. サブ表題
2. 区画幅
3. 段替え

5. 「Block E,F,G」サブ表題の装飾画像1，2，3

サブ表題を設定しております。画像も載せました


1　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white"＞
　　区画開始のコマンドです。区画幅は850です。
　　区画線幅は1です。背景色は#8B008Bです　　
2　　＜TBODY＞
　　区画開始のコマンドです
3　　＜TR＞＜TD align="center"＞
　　区画開始のコマンドです。文章配置は中央です
4　　＜h2＞＜a href="https://www.yamanotanbo.jp/videos3/0010179.MP4＞ホームページひとりぼっち、孤高のホーム
5　　ページ；動画ファイル（MP4）（平成27年4月12日撮影）＜/a＞＜/h2＞＜figure align="center"＞
　　文字サイズはh2のレベルです。画像位置は中央です。ビデオファイルを載せております
6　　＜IMG style=”WIDTH:550px;HEIGHT:px385px"
7　　src="https://www.yamanotanbo.jp/photo_gardenig3/DSC03857.JPG" alt=　　
8　　ホームページひとりぼっち＞＜/figure＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　画像を載せています。画像サイズは横550、横385です。alt=は画像の名前です
9　　＜TABLE width=850 border=1 bgcolor=""#8B008B" style="color:white"＞
10　　＜TBODY＞＜TR＞＜TD align="center"＞
　　区画開始のコマンドです。文章配置は中央です
11　　＜h2＞＜a href="https://www.yamanotanbo.jp/videos16/0011218.MP4＞相棒ができてうれしい
12　　動画ファイル（MP4）（平成31年4月13日撮影）＜/a＞＜br＞相棒が4年かけて生まれてきた＜br＞相棒＜/h2＞
　　動画ファイルを載せています。文字サイズはh2レベルです
13　　＜figure align="center"＞＜IMG style="WIDTH:550px;HEIGHT:385px"
14　　src="https://yamanotanbo.jp/photo_gardening8/DSC04770.JPG"　　
15　　alt=相棒ができてうれしい＜/figure＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　画像を載せています。画像サイズは横550、横385です。alt=は画像の名前です
16　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white＞
　　区画開始のコマンドです。区画幅は850です。背景色は#8B008Bです
17　　＜TBODY＞
　　区画開始のコマンドです
18　　＜TR＞＜TD align="center"＞
　　区画開始のコマンドです。文章配置は中央です
19　　＜h3＞＜a href="https://www.yamanotanbo.jp/videos/0020014.MP4＞自分で作ってみよう；
20　　テレビ置台を作りました；動画ファイル（MP4）＜/a＞＜/h3＞＜/TD＞＜/TR＞
　　動画ファイルを載せています。文字サイズはh3です
21　　＜TR＞＜TD align="center"＞
　　区画開始のコマンドです。文章配置は中央です
22　　＜figure＞＜IMG style="WIDTH:550px;HEIGHT:385px"
23　　src="https://www.yamanotanbo.jp/photo_index/DSC02697.JPG" alt=テレビ置き台＞
24　　＜/figure＞
　　画像を載せています。画像サイズは横550、横385です。alt=は画像の名前です
25　　＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　区画の終了コマンドの実行です

「Block E,F,G」サブ表題の装飾画像1，2，3

サブ表題の装飾画像

KEY WORDS
1. サブ表題の装飾画像
2. 文章配置は中央
3. 画像位置は中央

6. 「Block H」ホームページのアイテムご案内

ホームページのアイテムをご案内しております

「Block H」ホームページのアイテムご案内 1（表題）


1　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white"＞
　　区画開始のコマンドです。区画幅は850です。区画線幅は1です。背景色は#8B008Bです
2　　＜TBODY＞
　　区画開始のコマンドです
3　　＜TR＞＜TD height=50＞ ,br>　　区画開始のコマンドです。区画の厚みは50です
4　　＜h2＞＜br＞自分で作ってみよう、目次
　　文字の大きさはh2です。段替えです
5　　＜br＞概要は右の（私の雑感）をクリック
　　段替えです。
6　　＜A href="https://www.yamanotanbo.jp/thoughts.html"＞自分でやってみよう 14　;My
7　　THOUGHTS(私の雑感）＜/A＞＜/h2＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　thoughts.htmlをご案内しています。区画終了のコマンド実行です

ホームページのアイテムご案内

「Block H」ホームページのアイテムご案内 2


1　　＜TABLE width=850 border=1 bgcolor="#FFFFFF" class="p080"＞＜TBODY＞＜TR＞
　　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#FFFFFF。文字の大きさはp080。区画に入るコマンドの実行。段替え実行
2　　＜TD＞No.＜/TD＞＜TD width=700＞Html Name＜/TD＞＜TD align=center width=50＞Year of Issue＜/TD＞＜/TR＞
　　　No.の記入。幅700でホームページの名前を記入。幅50で発行年の記入。配置はセンター
3　　＜TR＞＜TD＞00＜/TD＞
　　　段替え実行。ナンバーは00で記入
4　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp/index,html"＞自分で作ってみよう　HOME＜/A＞＜/TD＞＜TD
　　　リンク先の名前を左基準で記入。題名を記入
5　　align=center＞2013＜/TD＞＜/TR＞
　　　発行年を中央に記入
6　　＜TR＞＜TD＞01＜/TD＞
　　　段替え実行。ナンバー01を記入
7　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp/television.html"＞自分で作ってみよう　1：テレビ置き台（LC-26GD3）
　　　リンク先の名前を左基準で記入。題名を記入
8　　＜/A＞＜/TD＞＜TD align=center＞2013＜/TD＞＜/TR＞
　　　発行年を中央に記入
9　　＜TR＞＜TD＞02＜/TD＞
　　　段替え実行。ナンバー02を記入
10　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp/cdstore.html"＞自分で作ってみよう　2CD収納庫＜/A＞＜/TD＞＜TD
　　　リンク先の名前を左基準で記入。題名を記入
11　　align=center＞2013＜/TD＞＜/TR＞
　　　発行年を中央に記入
12　　＜TR＞＜TD＞03＜/TD＞
　　　段替え実行。ナンバー03を記入
13　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp/camera.html"＞自分で作ってみよう　3；カメラディスプレイ
　　　リンク先の名前を左基準で記入。題名を記入
14　　＜/A＞＜/TD＞＜TD align=center＞2013＜/TD＞＜/TR＞
　　　発行年を中央に記入
15　　＜TR＞＜TD＞04＜/TD＞
　　　段替え実行。ナンバー04を記入
16　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp/composition.html"＞自分で作ってみよう　4；コンポ置き台＜/A＞
　　　リンク先の名前を左基準で記入。題名を記入
　　　＜/TD＞＜TD
17　　align=cnter＞2013＜/TD＞＜/TR＞
　　　発行年を中央に記入
18　　＜TR＞＜TD＞73＜/TD＞
　　　段替え実行。ナンバー73を記入
19　　＜TD align=left＞＜A href="https://www.yamanotanbo.jp.crisis.html"＞私の精選十大危機；MY SELECTED 10 CRISES
　　　（私の十大
20　　危機を精選してみました）
　　　リンク先の名前を左基準で記入。題名を記入
21　　＜/A＞＜/TD＞＜TD align=center＞2021＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞　　
　　　発行年を中央に記入。区画コマンドの終了を記入する

ホームページのアイテムご案内

KEY WORDS
1. 区画線幅は1
2. 区画の厚み
3. 区画終了のコマンド

7. 「Block I」本ページの主題1

本ページの主題1を設定しております


1　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white"＞
　　　区画開始のコマンドです。区画幅は850です。区画線幅は1です。背景色は#8B008Bです。文字色は白です
2　　＜TBODY＞
　　　区画開始のコマンドです
3　　＜TR＞＜TD height=50＞
　　　区画開始のコマンドです。区画幅は50です
4　　＜h2＞＜br＞自分で作ってみよう；私の物づくり方針＜/h2＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　　文字の大きさはh2のレベルです。段替え実行。区画終了のコマンドです
5　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white class="p080"＞
　　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白。文字の大きさはp080　
6　　＜TBODY＞
　　　区画に入るコマンドの実行
7　　＜TR＞＜TD width=20＞01＜/TD＞
　　　段替え実行。区画幅は20。行終了のコマンド
8　　＜TD align=left width=730＞自分でデザインする＜/TD＞＜/TR＞
　　　区画幅は730。文章は左寄り。行終了のコマンド
9　　＜TR＞＜TD＞02＜/TD＞
　　　段替え実行。行終了のコマンド
10　　＜TD align=left＞最寄りのホームセンターで材料を調達する＜/TD＞＜/TR＞
　　　文章は左寄り。行終了のコマンド
11　　＜TR＞＜TD＞03＜/TD＞
　　　段替え実行。行終了のコマンド
12　　＜TD align=left＞他のホームセンターで探さない＜/TD＞＜/TR＞
　　　文章は左寄り。行終了のコマンド
13　　＜TR＞＜TD＞04＜/TD＞
　　　段替え実行。行終了のコマンド
14　　＜TD align=left＞調達出来た材料で設計し直す＜/TD＞＜/TR＞
　　　文章は左寄り。行終了のコマンド
15　　＜TR＞＜TD＞05＜/TD＞
　　　段替え実行。行終了のコマンド
16　　＜TD align=left＞ペイント塗料は使わない。その代替えとして、ビニールシートを貼る＜/TD＞＜/TR＞
　　　文章は左寄り。行終了のコマンド
17　　＜TR＞＜TD＞06＜/TD＞
　　　段替え実行。行終了のコマンド
18　　＜TD align=left width=650＞板どうしの接合は皿ビスのみで行う。皿ビスの頭が出っ張らないように、
　　　文章は左寄り。区画幅は650
19　　皿錐ビットを使って、円錐の穴を開ける。ドリルの径はビスの大きさに配慮して決める＜/TD＞＜/TR＞
　　　行終了のコマンド
20　　＜TR＞＜TD＞07＜/TD＞
　　　段替え実行。行終了のコマンド
21　　＜TD align=left＞化粧板の表面を皿ビスの先で変形させないように気をつける＜/TD＞
　　　文章は左寄り。行終了のコマンド
22　　＜/TR＞＜/TBODY＞＜/TABLE＞　　
　　　区画終了のコマンド

「Block I」本ページの主題1

本ページの主題1

KEY WORDS
1. 段替え実行
2. 行終了
3. 文章は左寄り
4. 区画終了

8. 「Block J」本ページの主題2

本ページの主題2を設定しております


1　　＜TABLE width=850 border=1 bgcolor=#8B008B style="color:white"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白
2　　＜TBODY＞
　　区画に入るコマンドの実行
3　　＜TR＞
　　段替えのコマンドの実行　　
4　　＜TD height=50＞
　　行開始のコマンドの実行。行高さは50
5　　＜h2＞＜br＞自分で作ってみよう；物づくりの配置とアイテム数＜/h2＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　一段行明けのコマンドの実行。文字の大きさはh2で、自分で作ってみよう；物づくりの配置とアイテム数と記入。
　　区画終了のコマンドの実行
6　　＜TABLE width=850 border=1 bgcolor=#8B008B style="color:white" class="p080"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白。文字の大きさはp080
7　　＜TBODY＞
　　区画に入るコマンドの実行
8　　＜TR＞
　　段替えのコマンドの実行
9　　＜TD align=middle width=200＞設置場所＜/TD＞
　　行開始のコマンドの実行。行幅200で設置場所と記入。行終了のコマンドの実行
10　　＜TD align=middle width=56＞リビング＜/TD＞
　　行開始のコマンドの実行。行幅46でリビングと記入。行終了のコマンドの実行
11　　＜TD align=middle width=46＞廊下＜/TD＞
　　行開始のコマンドの実行。行幅46で廊下と記入。行終了のコマンドの実行
12　　＜TD align=middle width=56＞トイレ＜/TD＞
　　行開始のコマンドの実行。行幅56でトイレと記入。行終了のコマンドの実行
13　　＜TD align=middle width=46＞浴室＜/TD＞
　　行開始のコマンドの実行。行幅46で浴室と記入。行終了のコマンドの実行
14　　＜TD align=middle width=46＞台所＜/TD＞
　　行開始のコマンドの実行。行幅46で台所と記入。行終了のコマンドの実行
15　　＜TD align=middle width=46＞寝室＜/TD＞
　　行開始のコマンドの実行。行幅46で寝室と記入。行終了のコマンドの実行
16　　＜TD align=middle width=56＞和室＜/TD＞
　　行開始のコマンドの実行。行幅56で和室と記入。行終了のコマンドの実行
17　　＜TD align=middle width=56＞洗面所＜/TD＞
　　行開始のコマンドの実行。行幅56で洗面所と記入。行終了のコマンドの実行
18　　＜TD align=middle width=46＞玄関＜/TD＞
　　行開始のコマンドの実行。行幅46で玄関と記入。行終了のコマンドの実行
19　　＜TD align=middle width=48＞計＜/TD＞＜/TR＞
　　行開始のコマンドの実行。行幅48で計と記入。行終了のコマンドの実行
20　　＜TR＞
　　段替えのコマンドの実行　　
21　　＜TD align=middle＞件数＜/TD＞
　　行開始のコマンドの実行。行間中央に件数と記入。行終了のコマンドの実行　　　
22　　＜TD align=middle＞11＜/TD＞
　　行開始のコマンドの実行。行間中央に11と記入。行終了のコマンドの実行
23　　＜TD align=middle＞4＜/TD＞
　　行開始のコマンドの実行。行間中央に4と記入。行終了のコマンドの実行
24　　＜TD align=middle＞3＜/TD＞
　　行開始のコマンドの実行。行間中央に3と記入。行終了のコマンドの実行
25　　＜TD align=middle＞2＜/TD＞
　　行開始のコマンドの実行。行間中央に2と記入。行終了のコマンドの実行
26　　＜TD align=middle＞2＜/TD＞
　　行開始のコマンドの実行。行間中央に2と記入。行終了のコマンドの実行
27　　＜TD align=middle＞1＜/TD＞
　　行開始のコマンドの実行。行間中央に1と記入。行終了のコマンドの実行
28　　＜TD align=middle＞1＜/TD＞
　　行開始のコマンドの実行。行間中央に1と記入。行終了のコマンドの実行
29　　＜TD align=middle＞1＜/TD＞
　　行開始のコマンドの実行。行間中央に1と記入。行終了のコマンドの実行
30　　＜TD align=middle＞1＜/TD＞
　　行開始のコマンドの実行。行間中央に1と記入。行終了のコマンドの実行
31　　＜TD align=middle＞26＜/TD＞＜/TR＞
　　行開始のコマンドの実行。行間中央に26と記入。行終了のコマンドの実行
32　　＜TR＞
　　段替えのコマンドの実行　
33　　＜TD align=middle＞%＜/TD＞
　　行開始のコマンドの実行。行間中央に%と記入。行終了のコマンドの実行　
34　　＜TD align=middle＞42.0＜/TD＞
　　行開始のコマンドの実行。行間中央に42.0と記入。行終了のコマンドの実行
35　　＜TD align=middle＞15.0＜/TD＞
　　行開始のコマンドの実行。行間中央に15.0と記入。行終了のコマンドの実行
36　　＜TD align=middle＞12.0＜/TD＞
　　行開始のコマンドの実行。行間中央に12.0と記入。行終了のコマンドの実行
37　　＜TD align=middle＞7.7＜/TD＞
　　行開始のコマンドの実行。行間中央に7.7と記入。行終了のコマンドの実行
38　　＜TD align=middle＞7.7＜/TD＞
　　行開始のコマンドの実行。行間中央に7.7と記入。行終了のコマンドの実行
39　　＜TD align=middle＞3.9＜/TD＞
　　行開始のコマンドの実行。行間中央に3.9と記入。行終了のコマンドの実行
40　　＜TD align=middle＞3.9＜/TD＞
　　行開始のコマンドの実行。行間中央に3.9と記入。行終了のコマンドの実行
41　　＜TD align=middle＞3.9＜/TD＞
　　行開始のコマンドの実行。行間中央に3.9と記入。行終了のコマンドの実行
42　　＜TD align=middle＞3.9＜/TD＞
　　行開始のコマンドの実行。行間中央に3.9と記入。行終了のコマンドの実行
43　　＜TD align=middle＞100＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　行開始のコマンドの実行。行間中央に100と記入。行終了のコマンドの実行。区画終了のコマンドの実行

「Block J」本ページの主題2
本ページの主題2
本ページの主題2

KEY WORDS
1. 区画幅は850
2. 行開始のコマンドの実行
3. 一段行明けのコマンドの実行
4. 区画終了のコマンドの実行

9. 「Block K」本ページの主題3

本ページの主題3を設定しております


1　　＜TABLE width=850 border=1 bgcolor=#8B008B style="color:white"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白
2　　＜TBODY＞
　　区画に入るコマンドの実行　　
3　　＜TR＞
　　段替えのコマンドの実行 　
4　　＜TD height=50＞
　　行開始のコマンドの実行。行高さは50
5　　＜h2＞＜A href="https://www.yamanotanbo.jp/photo_thoughts/img300301002.pdf"＞「自分で作ってみよう」　
6　　「自分でやってみよう」解説PDF＜/a＞＜/h2＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　PDFシートへのリンクのご案内。文字の大きさのレベルはh2。区画終了のコマンドの実行　　
7　　＜TABLE width=850 border=1 bgcolor=#8B008B style="color:white"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白
8　　＜TBODY＞
　　区画に入るコマンドの実行
9　　＜TR＞
　　段替えのコマンドの実行
10　　＜TD TD align="center"＞＜br＞＜a href="https://www.yamanotanbo.jp/photo_thoughts/img300301002.pdf"＞
　　行開始のコマンドの実行。行センターの配置とする。PDFシートへのリンクのご案内。
11　　＜FIGURE＞＜IMG style="WIDTH:500px;HEIGHT:350px"
12　　src="https://www.yamanotanbo.jp/puoto_walking/DSC02499.JPG" alt=「自分で作ってみよう」　
13　　解説　PDF＞＜/FIGURE＞＜/a＞
　　画像挿入のコマンドの実行。画像の大きさは横500，縦350　altは画像の名前。
　　画像の貼ってあるリンクの終了のコマンドの実行　　
14　　＜h3＞＜a href="https://www.yamanotanbo.jp/videos/0020370.MP4"＞
15　　ヒマワリ畑に出会いました；動画ファイル（MP4）＜/a＞＜/h3＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　動画ファイルリンクへのご案内。文字の大きさはh3のレベル。リンク終了宣言。区画終了コマンドの実行

「Block K」本ページの主題3

本ページの主題3

KEY WORDS
1. 区画線幅は1
2. 背景色は#8B008B
3. 段替えのコマンドの実行
4. 行開始のコマンドの実行

10. 「Block L,M,N」本ページ主題4　画像1，2，3，

本ページの主題4を設定しております。画像を添付しております


1　　＜TABLE width=850 border=1 bgcolor="#8B008B" style="color:white"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#8B008B。文字色は白
2　　＜TBODY＞
　　区画に入るコマンドの実行
3　　＜TR＞
　　段替えのコマンドの実行
4　　＜TD alogn="center" height=295＞
　　行開始のコマンドの実行。行高さは295
5　　＜FIGURE＞＜IMG style="WIDTH:500px;HEIGHT:350px"
6　　src="https://www.yamanotanbo.jp/photo_gardening3/DSC03856.JPG" alt=チューリップ＞
7　　＜/FIGURE＞＜/A＞＜FIGCAPTION＞
　　画像挿入のコマンドの実行。画像の大きさは横500，縦350　altは画像の名前。
8　　＜h3 align="center"＞＜a href="https://www.yamanotanbo.jp/videos3/0010182.MP4"＞
9　　チューリップが咲いていました；動画ファイル（MP4）＜/a＞＜/h3＞＜/FIGCAPTION＞＜/TD＞＜/TR＞
　　動画ファイルリンクへのご案内。文字の大きさはh3のレベル。文字は中央に配置。リンク終了宣言。区画終了コマンドの実行
10　　＜TR＞
　　段替えのコマンドの実行
11　　＜TD alogn="center" height=295＞
　　行開始のコマンドの実行。配置はセンター。行高さは295
12　　＜FIGURE＞＜IMG style="WIDTH:500px;HEIGHT:350px"
13　　src="https://www.yamanotanbo.jp/photo_walking/RIMG0099.JPG" alt=ボトルブラッシュ＞＜/FIGURE＞＜/A＞
　　画像挿入のコマンドの実行。画像の大きさは横500，縦350　altは画像の名前。
14　　＜FIGCAPTION＞＜h3 align="center"＞＜a href="https://www.yamanotanbo.jp/videos/0020008.MP4"＞
15　　ボトルブラッシュが咲いていました；動画ファイル（MP4）＜/a＞＜/h3＞＜/FIGCAPTION＞＜/TD＞＜/TR＞
　　動画ファイルリンクへのご案内。文字の大きさはh3のレベル。文字は中央に配置。リンク終了宣言。区画終了コマンドの実行
16　　＜TR＞
　　段替えのコマンドの実行
17　　＜TD alogn="center" height=295＞
　　行開始のコマンドの実行。行高さは295
18　　＜FIGURE＞＜IMG style="WIDTH:500px;HEIGHT:350px"
19　　src="https://www.yamanotanbo.jp/photo_gardening6/DSC04172.JPG" alt=ノコンギク＞＜/FIGURE＞＜/A＞
　　画像挿入のコマンドの実行。画像の大きさは横500，縦350　altは画像の名前。　　
20　　＜FIGCAPTION＞＜h3 align="center"＞＜a href="https://www.yamanotanbo.jp/videos6/0010335.MP4"＞
21　　ノコンギクが咲いていました；動画ファイル（MP4）＜/a＞＜/h3＞＜/FIGCAPTION＞
22　　＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　動画ファイルリンクへのご案内。文字の大きさはh3のレベル。文字は中央に配置。リンク終了宣言。区画終了コマンドの実行　　

「Block L,M,N」本ページ主題4　画像1，2，3，

本ページの主題4

KEY WORDS
1. 区画コマンドの実行
2. 区画幅は850
3. リンク終了宣言
4. 文字は中央に配置

11. 「Block O,P」本ページ主題5　

本ページ主題5を設定しております


1　　＜TABLE width=850 border=1 bgcolor="#FFFFFF"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#FFFFFF
2　　＜TBODY＞
　　区画に入るコマンドの実行
3　　＜TR＞
　　段替えのコマンドの実行
4　　＜TD align="center"＞＜a href="index.html#a01"＞＜h3＞戻る＜/h3＞＜/a＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞
　　行開始のコマンドの実行。配置はセンター。戻るクリックで、本ページの＜SECTION id=a01＞（巻頭）に戻る指令の実行。
　　区画コマンドの終了宣言
5　　＜TABLE width=850 border=1 bgcolor="#FFFFFF"＞
　　区画コマンドの実行。区画幅は850。区画線幅は1。背景色は#FFFFFF
6　　＜TBODY＞
　　区画に入るコマンドの実行
7　　＜TR＞
　　段替えのコマンドの実行
8　　＜TD align="center"＞＜h3＞Copyright＆copy;Oct.2013「自分で作ってみよう」「自分でやってみよう」
　　行開始のコマンドの実行。配置はセンター。Copyright＆copyは著作権表示。文字の大きさはh3レベル
9　　　All Right Reserved
　　著作権ありの表示
10　　＜br＞本ホームページ上（リンクページを含む）のすべてのコンテンツの
11　　無断使用を禁じます＜/h3＞＜/TD＞＜/TR＞＜/TBODY＞＜/TABLE＞＜br＞＜br＞＜br＞
　　brは段替え指示。区画コマンドの終了宣言
12　　＜/div＞
　　divコマンドの終了宣言
13　　＜/CENTER＞
　　中央配置の終了宣言
14　　＜/BODY＞＜/div＞＜/HTML＞
　　ホームページ本文の終了宣言。divコマンドの終了宣言。ホームページ全終了の宣言

「Block O,P」本ページ主題5　

本ページの主題4

KEY WORDS
1. 著作権ありの表示
2. divコマンドの終了宣言
3. 中央配置の終了宣言
4. ホームページ全終了の宣言

12. css sheet のご案内　

この章で、css sheetの主な内容をご案内します


@charset"EUC-JP";
/*=====================================
初期設定
=======================================*/
body{
　　margin:0
　　padding:0
　　background color:#E6E6FA
　　font-family:MSP ゴシック
}
/*======================================
文字サイズ
=======================================*/
.xxs{font-size:xx-small}
.xs{font-size:x-small}
.s{font-size:small}
.m{font-size:medium}
.l{font-size:large}
.xl{font-size:x-large}
.xxl{font-size:xx-large}
.smaller{font-size:smaller}
.larger{font-size:larger}
.s09{font-size:9px;
　　line-height:1.1;
}
.s11{font-size:11px;
　　line-height:1.1;
}
.p080{font-size:80%;
　　line-height:1.2;
}
h1{
　font-size:18px;
　line-height:1.4;
}
h2{font-size:16px:
　line-height:1.4;
}
h3{font-size:14px;
　line-height:1.3;
}
h4{font-size:12px;
　line-height:1.2;
}
p{font-size:13px;
　line-height:1.2;
}
*/===================================
リンク色
====================================*/
a:link
{
text-decoration:none;
background:transparent;
color:#73A6c2;
}
a:visited
{
text-decoration:none;
background:transparent;
color:#73A6c2;
}
a-hover
{
text-decoration:underline;
background:transparent;
color:#73A6c2
}
/*===================================
ヘッダ
====================================*/
/*===================================
メインメニュー
====================================*/
div#page{
　　margin:0;
　　width:1300px;
}
div#main{
　　margin:0;
　　width:400px;
　　font:left;
}
div#sub{
　　margin:0;
　　width:900px;
　　font:right;
}
div.sample1{
width:700px;height:40px;
margin:5px;padding:10px;border:1px;
}
div.sample2{
width:700px;height-40px;
margin:5px;padding:10px;border:1px solid yellow;
} 　　　　

css sheet のご案内　

css

KEY WORDS
1. 初期設定
2. 文字サイズ
3. ヘッダ
4. メインメニュー

13. ウェブ関連サイトへのご案内　

この章では、ウェブ関連サイトの内容をご案内します

⇒自分でやってみよう1；WEB PAGE STUDY（ウェブ道を歩こう）
⇒自分でやってみよう21；HP ANNIVERSARY(ホームページ開設一周年)
⇒私のインターネット物語；MY INTERNET STORY　
⇒自分でやってみよう22；A 3RD-YEAR STUDENT STUDYING WEBDOU（私はウエブ道を歩んでいる三回生です）
⇒自分でやってみよう23；A 4TH-YEAR STUDENT STUDYING WEBDOU（私はウエブ道を歩んでいる四回生です）
⇒自分でやってみよう25；MOVING SERVER（サーバをかえてみよう）
⇒自分でやってみよう28; RENTING SERVER（サーバを借りてみよう）
⇒ウェブ追想；I REMEMBER MY WEB_HISTORY（私のウェブの歴史を振り返ってみました）

000. 「ウェブ練習」雑感PDF

ヒマワリ畑に出会いました；動画ファイル（MP4）

ウェブ練習PDF

戻る