バカネコ日記

フリーページ

2005年07月19日
XML
カテゴリ:バカネコPC講座
バカネコ村の記事を検索する


アロハシャツ(オレンジ)

アロハシャツ(グリーン)


テーブルタグは、何も表を作るだけが能ではない。
枠線の太さを0にしてしまえば、表に見えないので、
写真や文章の配置決め、すなわちレイアウトにもよく利用される。

このシリーズは、その性質を利用してレイアウトする方法について
解説したものだ。
本日のバカネコ講座は、テーブルレイアウトの4回目。
テーブルの大きさを指定する方法について紹介する。

始めて来られた方は、前回までの説明を順に読んでいただくと
わかりやすいと思う。
  レイアウトの方法 1
  レイアウトの方法 2
  レイアウトの方法 3



さて、前回の例を引っぱり出してみよう。
右側の文章は、複数の行を入れることができるが、
簡単にするため、1行だけにしてある。
このネコはヒマラヤン種。

 HTMLサンプル↓
   <table>
   <tr>
   <td> src="MyURL"></td>
   <td >このネコはヒマラヤン種。</td>
   </tr>
   </table>

このままでも、使えるのだが、ちょっと小さい。
枠の大きさを自由に指定したい時もある。



そこで、文章のマスの横幅を、300ピクセルにしてみる。
使う呪文は、width="300" だ。
これを、文章マス用のtdタグに放り込むことにする。

   <table>
   <tr>
   <td> src="MyURL"></td>
   <td width="300">このネコはヒマラヤン種。</td>
   </tr>
   </table>

これを、インターネットエクスプローラなどで、表示させると、以下のようになる。

このネコはヒマラヤン種。

もちろん、日記ページに書く時には、自動改行対策として、
以下のように1行につなげて書く必要がある。

<table border="1"><tr><td><img src="MyURL" ></td><td width="300">このネコはヒマラヤン種。</td></tr></table>



高さは、height で指定でき、要領は同じである。
heightは、trタグの中に入れるのが、正解というものであろう。
しかし、以下のように、どれかひとつの、tdタグの中に入れても、
効果は、その行全体に及び、隣のマスの高さも同じになる。

   <table>
   <tr>
   <td> src="MyURL"></td>
   <td width="300" height="300">このネコはヒマラヤン種。</td>
   </tr>
   </table>

 表示例 ↓
このネコはヒマラヤン種。


枠線は省略してあるが、上記の<table>のところを、<table border="1">と書けば、
枠線が表示される。

【本日のポイント】
1.マスの横幅は、width で、高さは height で指定する。
2.マスのサイズは、tdタグの中で指定する。
3.ひとつのマスの高さを決めると、同行のマスはすべて影響される。



【トド短信】
 バカネコ・エディタの改造をやっていたら、日付が変わってしまった。
 重宝するのは、テーブルタグの改行つぶし機能だ。
 こんなもん、日本じゅう探したってあるまい。
 でも、これがないと、めんどくさくて、楽天日記など書く気がしない。
 実際に表示されるものが、いつも、意図していたものと食い違うからだ。


【ダウンロードページ】
・楽天日記専用バックアップツール、バーニャン3号のサンプル版、
 「バーニャン・ミニ」のダウンロードはこちら。
・にゃんタグのサンプル版は、このページの中段付近。
・バカネコ・ビューアのダウンロードはここ。

1日1票! ブログランキング→ぜひ、クリックしてね


※バカネコ講座では、安全な方法を選んで紹介していますが、
 途中でわけがわからなくなっても、責任は負えませんので、あらかじめご了承下さい。


ネコでもわかるPC講座はこちら → バカネコ講座


悲惨なキャンセル事情 バカネコ講座 バカネコソフト バカネコ村 爆笑ガイド 猫砂の研究 パソコン購入費用の削り方 現物の投下位置 ずぼらなアクセスアップ ページを読みやすくする方法 バーニャン・ミニ 楽天日記のバックアップ にゃんこのコスプレ テキストリンク下線の消し方 楽しめるアフィリ 己を知れ 自分のPCを知る バカネコ・ビューア バーニャン3号 にゃんタグ・フルバージョン 【楽天トラベル】


画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。
このサイトの新着記事の通知をご希望の方はご利用ください。






最終更新日  2005年07月20日 01時05分59秒
コメント(14) | コメントを書く

PR

バックナンバー

2019年08月
2019年07月
2019年06月
2019年05月
2019年04月

プロフィール


海獣トド

コメント新着

 海獣トド@ Re:意外な一面に触れて。(08/14) 泡雪さんへ >マザーテレサって本当にす…
 海獣トド@ うめぼしがキラリ☆さんへ >ひゃー、ブログさぼってる間にトドさん…
 海獣トド@ 鵜の岬さんへ >これからも・・ヨロシク・・ね こち…
 海獣トド@ sshijimisanさんへ >でも、トド様のおかげで少しの村民は救…
 海獣トド@ もぐらのこさんへ >日記の下書き機能残ってるよ(^-^) …
 海獣トド@ archfelisさんへ >せめて12日一杯残せばいいのに・・・…

Copyright (c) 1997-2019 Rakuten, Inc. All Rights Reserved.