・「ココログ」上、「表」の作成

2019年3月 9日 (土)

【個人メモ】「ココログ」上、「表」の作成(5)- 複雑な表 - (縦に並んだセルを一つに結合)

□下記の「縦に並んだセルを一つに結合する」方法を調べた。
 次の「超簡単ホームページ作成」に解決方法が記載されていた。
 <抱負>1回で成功したい。
 ●超簡単ホームページ作成「複雑なテーブルの作り方 - 超簡単ホームページ作成」
  *一部抜粋
   「縦に並んだセルを一つに結合する
   <TD rowspan="数字">というタグを使い、
   『数字』には結合したいセルの数を入れます。」
<修正前1>
 「<table align="center" style="border: 1px solid rgb(204, 204, 204); border-image: none; width: 80%; border-collapse: collapse;"><tbody><tr><td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">書き込み<br />アクセス</td>
<td colspan="2" style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td></tr>
<tr><td style="padding: 10px; font-weight: bold; background-color: rgb(249, 252, 254);">&nbsp;</td>
<td style="padding: 10px; border: 1px solid rgb(204, 204, 204); border-image: none;">すべて可能</td>」
【表1】 *修正前
書き込み
アクセス
読み取りアクセスとトランザクショの作成
  すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
 
<第1回修正後→成功>
*入力
 「<table align="center" style="border: 1px solid rgb(204, 204, 204); border-image: none; width: 80%; border-collapse: collapse;"><tbody><tr><td rowspan="2" style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">書き込み<br />アクセス</td>
<td colspan="2" style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td></tr>
<tr>
<td style="padding: 10px; border: 1px solid rgb(204, 204, 204); border-image: none;">すべて可能</td>
【表2】 *第1回修正→成功

書き込み
アクセス
読み取りアクセスとトランザクショの作成
すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
[△最新情報へ]

(以上)

【個人メモ】「ココログ」上、「表」の作成(4)- 複雑な表 -

□下記の「横に並んだセルを一つに結合する」方法を調べた。
 次の「超簡単ホームページ作成」に解決方法が記載されていた。
 (例)<修正前><TD >1</TD><TD >2</TD><TD >3</TD>
            ↓
    <したいこと>・横に並んだ「1,2,3」の3個のセルを、
            「1」だけの1個のセルに統合したい。
            ↓
    <修正後><TD colspan="3">1</TD>
<修正前1>
 「<td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td>」
【表1】 *修正前
書き込み
アクセス
読み取りアクセスとトランザクショの作成  
  すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
<第1回修正後→失敗>
*入力
 「<td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);" colspan="2">読み取りアクセスとトランザクショの作成</td>」
*ココログ上の自動修正
<td colspan="2" style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td>
【表2】 *第1回修正→失敗
      (2個のセルが結合されたが、その右横に1個のセルが
      追加されてしまった。)
書き込み
アクセス
読み取りアクセスとトランザクショの作成  
  すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
 
<第2回修正→失敗>
 「<td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);"><td colspan="2">読み取りアクセスとトランザクショの作成</td>」 
【表3】 *第2回修正→失敗
      (訳がわからなくなってしまった。)
書き込み
アクセス
  読み取りアクセスとトランザクショの作成  
  すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
 
<仕切り直し:修正前2>
 「<td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td>
<td style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">&nbsp;</td></tr>
<第3回修正→成功>
*入力
<td colspan="2" style="padding: 5px; border: 1px solid rgb(204, 204, 204); border-image: none; font-weight: bold; background-color: rgb(244, 248, 255);">読み取りアクセスとトランザクショの作成</td></tr>
【表4】 *第3回修正→成功
書き込み
アクセス
読み取りアクセスとトランザクショの作成
  すべて可能 制限あり
すべて可能 パブリック&非許可型 プライベート&非許可型
制限あり パブリック&許可型 プライベート&非許可型
<感想>原因は、次の「右隣のセル」を消去してなかったことだ。苦笑した。
(以上)

2019年2月20日 (水)

【個人メモ】「ココログ」上、「表」の作成(3)- 備忘帳 -

□「ココログ」上、「表」の作成方法の一例は、次の通りである。
 (1)「表」の”HTML”文を作成する。
  (表の作成支援ツールの一例)
  ●無料ツール.net「テーブルタグ作成ツール」
 (2)上記(1)で作成した「表」の”HTML”文をコピーし、
  「ココログ」中に貼り付ける。
 
 ・「ココログ」上での”HTML”の貼り付けは、既に作成した”本文”において、タブ”編集エリア”をタブ”HTML編集”に切り替える。
  その後、”HTML”上で「表」の貼り付け位置を探し、コピーした”HTML”文を貼り付ける。
  「表」の貼り付け位置は、日本文を頼りに私は探した。
 
 ・”HTML”文を貼り付けた結果は、タブ”HTML編集”をタブ”編集エリア”に戻すことで見られる。
□「ココログ」上、「表」の修正方法の一例は、次の通りである。
 (1)「表」の左右の幅の修正方法(一例)
 ○「<table style=・・・width: 100%;">」中の「width: 100%」の数値を変更する。
 ・既に作成した”本文”中において、タブ”HTML編集”に切り替える。
  ”HTML”文中、「<table style=」を探した。 
 ・”HTML”文中、
  「<table style="border: 1px solid #CCC;border-collapse: collapse;width: 100%;">」と記入されていた。(上記ツール上、「width: 100%」が”デフォルト”のようだ。) 
 ・上記文中の「width: 100%;">」の数値を、「width: 60%;">」に減らした。 
 ・タブ”編集エリア”に戻すと、「表」の左右の幅が狭くなった。
 (2)「表」の表示位置の修正方法(一例)
 ・私の説明より、次のページが参考になる。
  (表に関する”タグ”の説明ページの一例)
  ●TAG index「表の配置とテキストの回り込み」
 (3)「表」中の文字の表示位置の修正方法(一例)
 ・私の説明より、次のページが参考になる。
  (表に関する”タグ”の説明ページの一例)
  ●TAG index「セル内の文字の位置を指定する」
(以上)

2019年2月17日 (日)

【個人メモ】「ココログ」上、「表」の作成(2)- 表中の文字の配置 -

□「【個人メモ】「ココログ」上、「表」の作成(1)」において、「表」中の文字の配置を修正したいと記載した。
□しつこい性格なので、ネット上で、調べた。
 ・「表」中の「文字」を、「右寄せ」で表示させるためには、タグ「align="right"」を、”HTML”文に追加するとあった。
  追加場所は、表中の文字の前の「<td ・・・>」の箇所である。
□例を挙げると、つぎの通りである。
 ・以前、投稿の
  ”【特許】【意匠】【商標】早期審査・審理(審査・審理期間及び申出件数)”の【表4】中の「180件」は、つぎのように”HTML”文が記入されていた。
  (既に作成した”本文”において、タブ”編集エリア”をタブ”HTML編集”に切り替えることで、”HTML”文を表示させた。)
 <修正前>
 「<td style="padding:10px;border: 1px solid #CCC;">180件</td>」
 (ココログ上、「未指定」の場合は、「左寄せ」のようだ。)
 ・どこにタグ「align="right"」を挿入したら良いのかわからない。
  いつものように、最後に次のように記入した。
 <記入例>
 「<td style="padding:10px;border: 1px solid #CCC;"▲align="right">180件</td>」
  ”▲”は半角スペースで、必要かどうか調べていない。
 ・タブ”編集エリア”に戻すと、文字「180件」が「表」中、「右側」配置されていた。
 ・確認までに、タブ”編集エリア”をタブ”HTML編集”に切り替え、修正箇所を見ると、次のように修正されていた。 
 <修正表記>
 「<td align="right"▲style="padding:10px;border: 1px solid #CCC;"">180件</td>」
 ・私の記入箇所が修正された。「ココログ」に助けられた。
  なお、「align="right"」が表中の文字の「右寄せ」、
  「中央揃え」は、「align="center"」である。
(以上)

2019年2月16日 (土)

【個人メモ】「ココログ」上、「表」の作成(1)

□「ココログ」に「表」を載せたく、悪戦苦闘した。
 不十分だが、忘れないうち、個人メモをしておく。
□ネットで調べたが、良くわからず、下記のツールにたどり着いた。
 ●無料ツール.net「テーブルタグ作成ツール」
  ”テーブルタグ作成ツールです。ホームページ作成ソフトを利用しなくても簡単に作成できます。”
□作業は、次の通りである。
 ・上記「テーブルタグ作成ツール」を利用して作成した「表」の”HTML”をコピーし、「ココログ」に貼り付ければ完了である。
  なお、私は、”HTML”に関する知識が無い。
 ・「ココログ」上での”HTML”の貼り付けは、既に作成した”本文”において、タブ”編集エリア”をタブ”HTML編集”に切り替える。
  その後、”HTML”上で「表」の貼り付け位置を探し、コピーした”HTML”文を貼り付ける。
  「表」の貼り付け位置は、日本文を頼りに私は探した。
 ・”HTML”文を貼り付けた結果は、タブ”HTML編集”をタブ”編集エリア”に戻すことで見られる。
□”編集エリア”に表示された「表」で良ければ、アップし完了である。
□「表」の左右の幅の修正方法(一例)
 ・「表」の左右の幅が広かったので、幅を狭めた。
 ・既に作成した”本文”中において、タブ”HTML編集”に切り替える。
  ”HTML”文中、「<table style=」を探した。
 ・”HTML”文中、
  「<table style="border: 1px solid #CCC;border-collapse: collapse;width: 100%;">」と記入されていた。(上記ツール上、「width: 100%」が”デフォルト”のようだ。)
 ・上記文中の「width: 100%;">」の数値を、「width: 60%;">」に減らした。
 ・タブ”編集エリア”に戻すと、「表」の左右の幅が狭くなった。
□「表」の表示位置の修正方法(一例)
 ・「表」の左右の幅を狭めると、「表」が左寄りであることに気付き、「中央」に表示させた。
 ・ネットの情報で、中央位置に表示させるには、”HTML”文中の「<table style=」に「align="center"」の記載を追加するとあった。(ココログ上、「未指定」の場合は、「左側」配置のようだ。) 
 ・「<table style=」には、
  「<table style="border: 1px solid #CCC;border-collapse: collapse;width: 100%;">」と記入されていた。 
 ・「align="center"」の挿入位置がわからない。
  とりあえず、最後に「align="center"」の記載を追加し、
  「<table style="border: 1px solid #CCC;border-collapse: collapse;width: 100%;"▲align="center">」と記入した。
  ”▲”は半角スペースで、必要かどうか調べていない。
 ・タブ”編集エリア”に戻すと、「表」が中央に位置した。
<追記>
 ・「表」中、文字の表示位置が”左寄せ”なので、”センター”、”右寄せ”に修正したいが、面倒なので諦めた。
                        [△最新情報へ]
(以上)
2019年8月
        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