アサブロのhtmlモードは表現力が豊かになるが、そのデータ作成は
WISIWYG機能が無いために、試行錯誤になる。
これを何とか解消しようとして、ブラウザーOSであるeyeOSのeyeEditという
エディターが利用できるのではないかと思い立った。
Joomlaや新しいCMSではこのエディタパッケージ「TinyMCE」がかなり、
搭載されてきている。
そして、htmlのテキストベースの表示やその修正も可能であり、WISIWYG
のツールで作成したhtmlの部分的なテキストをasabloのhtmlモードの
入力素材とする。
その中でも、特に有用なものが、テーブル作成だ。
例えば、TinyMCEのGUIで表を作成して、html部分をコピーする。
そして、このブログの記事本文に貼り付けると、Tableの書式を全く
知らなくても下図のような表が出来上がるのだ。

項目	題名	内容
A	エディタ	食べれない。　便利だが、栄養が無い。
B	りんご	食べれる。　栄養がある。
C	オレンジ	食べれる。　栄養がある。

しかし、背景色と表示色がtinyMCEで表示したものから変更される。
上図のように非常に見づらくなるので最終確認は本番環境をブラウズする
事によって確認しなければならない。
編集画面上で本番環境のプレビューが出来るのが望ましいのだが...

インターフェース		転送（伝送）速度		備　　考
種　類	型　式	ｂｐｓ ( bit per second)	B/秒 (Byte per second)
RS	232C	115.2kｂｐｓ	14.4KB/秒	ｼﾘｱﾙ RS-232C
	422	10Mbps	1.3MB/秒	ｼﾘｱﾙ RS-422
MODEM	K56flex	56Kbps	7KB/秒
	V90	56kbps	7KB/秒
	PHS	64kbps	8KB/秒	PIAFS
	ISDN	64kbps	8KB/秒	2回線同時で128Kbps
LAN	10 BASE-T	10Mbps	1.3MB/秒
	100 BASE-TX	100Mbps	12.5MB/秒
LANによる 接続方法	ADSL	1.5Mbps	0.2MB/秒	左記の値は下りの速度
		↓	↓
		40Mbps	5MB/秒
	CATV	10Mbps	1.3MB/秒	ケーブルテレビ
		24Mbps	3MB/秒
	FTTH	100Mbps	12.5MB/秒	光ファイバー
USB	1.1	12Mbps	1.5MB/秒	ＵＳＢ Ｈｕｂとの併用で　最大 127 台まで接続可
	2.0	480Mbps	60MB/秒
IEEE	1284	2Mbps	250KB/秒	IEEE が 1994年に制定
	1394	400Mbps	50MB/秒	IEEE が 1995年に制定
SCSI	1	40Mbps	5MB/秒	ＳＣＳＩ
	2	80Mbps	10MB/秒	Ｆａｓｔ ＳＣＳＩ
		160Mbps	20MB/秒	Ｆａｓｔ Ｗｉｄｅ ＳＣＳＩ
		160Mbps	20MB/秒	Ｕｌｔｒａ Ｎａｒｒｏｗ ＳＣＳＩ
	3	320Mbps	40MB/秒	Ｕｌｔｒａ Ｗｉｄｅ ＳＣＳＩ
		320Mbps	40MB/秒	Ｕｌｔｒａ ２ Ｎａｒｒｏｗ ＳＣＳＩ
		640Mbps	80MB/秒	Ｕｌｔｒａ ２ Ｗｉｄｅ ＳＣＳＩ
		1280Mbps	160MB/秒	Ｕｌｔｒａ ３ ＳＣＳＩ
ATA	ATA	133.4Mbps	16.7MB/秒	ＡＴＡ
	DMA 33	264Mbps	33MB/秒	Ｕｌｔｒａ ATA 33
	DMA 66	528Mbps	66MB/秒	Ｕｌｔｒａ ATA 66
	DMA 100	800Mbps	100MB/秒	Ｕｌｔｒａ ATA 100
	DMA 133	1064Mbps	133MB/秒	Ｕｌｔｒａ ATA 133
	ｼﾘｱﾙ ATA	1200Mbps	150MB/秒	Serial ATA

メ デ ィ ア	転 送 速 度	備　　考
スマートメディア（SM）	メディアにより様々な速度のものが続出しています.。 そのため転送速度の記述はしばらく見合わせます。
コンパクトフラッシュ（CF）
ＳＤメモリカード（SD）
メモリスティック（MS）
マイクロドライブ（MD）
マルチメディアカード（MMC）

装　　　　置		転 送 速 度		備　　考
種　類	倍　速	ｂｐｓ ( bit per second)	B/秒 (Byte per second)
CD	1	1.2Mbps	150KB/秒	音楽ＣＤの通常の速度
	2	2.4Mbps	300KB/秒
	4	4.8Mbps	600KB/秒
	8	9.6Mbps	1200KB/秒
	12	12.0Mbps	1800KB/秒
	16	19.2Mbps	2400KB/秒
	20	24.0Mbps	3000KB/秒
	24	28.8Mbps	3600KB/秒
	40	48.0Mbps	6000KB/秒
	48	57.6Mbps	7200KB/秒
	52	62.4Mbps	7800KB/秒
DVD	1	11.1Mbps	1385KB/秒	ＤＶＤの通常の速度
	2	22.2Mbps	2770KB/秒
	4	44.3Mbps	5540KB/秒
	6	66.5Mbps	8310KB/秒
	10	110.8Mbps	13850KB/秒
	12	133.0Mbps	16620KB/秒
	16	177.3Mbps	22160KB/秒
PD	1	9.1Mbps	1141KB/秒
FDD	種　類	ｂｐｓ ( bit per second)	B/秒 (Byte per second)	備　　考
	2DD	2.4Mbps	300KB/秒	両面 倍密度 ﾀﾞﾌﾞﾙﾄﾗｯｸ
	2HD	4.0Mbps	500KB/秒	両面 高密度 ﾀﾞﾌﾞﾙﾄﾗｯｸ
	2HD	8.0Mbps	1000KB/秒	２倍速（装置のみ）
	2HD	16.0Mbps	2000KB/秒	４倍速（装置のみ）

◆ ATA （AT Attachment）：ＩＤＥをＡＮＳＩ（米国規格協会）で標準化した規格

◆ ＤＶＤ （Digital Versatile Disc, Digital Video Disc）：デジタル多用途ディスク

◆ IDE （Integrated Device Electronics）：内蔵型のハードディスクやCD-ROMに用いられ最大２台まで接続できる

◆ E-IDE （Enhanced Integrated Device Electronics） ： ＩＤＥを拡張した規格で最大４台まで接続できる

◆ IEEE （Institute of Electrical and Electronics Engineers）ｱｲ・ﾄﾘﾌﾟﾙ・ｲｰ ：米国電気電子学会

◆ ＳＣＳＩ （Small Computer System Interface）ｽｶｼﾞ：1986年にANSIが規格化したインターフェース

◆ ＵＳＢ （Universal System Bus）：シリアルインターフェース規格の一つでハブ（Hub）を使って最大１２７台まで接続可

【画像を動かす】
・デフォルト
＜Marquee＞＜img src="画像ＵＲＬ"＞＜/Marquee＞

・左から右へ
＜Marquee direction="right"＞ ＜img src="画像ＵＲＬ"＞ ＜/Marquee＞

・左右へ
＜Marquee behavior="alternate"＞ ＜img src="画像ＵＲＬ"＞ ＜/Marquee＞

・指定範囲で動かす
＜marquee width="400"＞＜img src="画像ＵＲＬ"＞＜/marquee＞

・ゆっくり動かす
＜marquee scrollamount="2" truespeed＞＜img src="画像ＵＲＬ"＞＜/marquee＞

・速く動かす
＜marquee scrollamount="100" truespeed＞＜img src="画像ＵＲＬ"＞＜/marquee>

・上へ
＜marquee direction="up" width="100" height="100" scrollamount="10" truespeed＞ ＜img src="画像ＵＲＬ"＞ ＜/marquee＞

・下へ
＜marquee direction="down" height="100" width="100" scrollamount="10" truespeed＞ ＜img src="画像ＵＲＬ"＞ ＜/marquee＞

・上下へ
＜marquee height="150" width="100" behavior="alternate" direction="up" scrollamount="10" truespeed＞ ＜img src="画像ＵＲＬ"＞ ＜/marquee＞

・背景色付き
＜marquee bgcolor="カラーコード"＞＜img src="画像ＵＲＬ"＞＜/marquee＞

・平行に何行も
＜marquee＞＜img src="画像ＵＲＬ"＞＜Br＞＜img src="画像ＵＲＬ"＞＜Br＞＜img src="画像ＵＲＬ"＞＜/marquee＞



・上下に動きながら
＜marquee behavior="alternate" direction="up" height="150"＞＜marquee direction="right"＞＜img src="画像ＵＲＬ"＞＜/marquee＞＜/marquee＞

【フィルター】　⇒（プレビュー：×）　（Web表示：○）
・画像を透明にする
＜img src="画像ＵＲＬ" style="filter:alpha(opacity=30)"＞

・画像をぼかす
＜img src="画像ＵＲＬ" style="filter:blur(add=0,direction=270,strength=10)"＞
・画像に影を付ける
＜div style="width:120;filter:shadow(color=カラーコード,direction=120);"＞ ＜img src="画像URL"＞ ＜/div＞

・画像をモノクロにする
＜img src="画像ＵＲＬ" style="filter:gray"＞

・画像色を反転する
＜img src="画像ＵＲＬ" style="filter:invert"＞

・レントゲン風画像
＜img src="画像ＵＲＬ" style="filter:xray"＞

・画像の左右を反転させる
＜img src="画像ＵＲＬ" style="filter:fliph()"＞

・画像の上下を反転させる
＜img src="画像ＵＲＬ" style="filter:flipv();"＞

【オンマウス】
・のせると表示　⇒×
＜span onmouseover="document.all.item('moji1').style.visibility='visible'"＞文字＜/span＞ ＜div ID="moji1" style="visibility:hidden;"＞ 表示文字 ＜/div＞
・のせると非表示　⇒○
＜span onmouseover="this.style.visibility='hidden'"＞消す文字 ＜/span＞
消したい文字
・のせると表示、離すと非表示　⇒×
＜span onmouseover="document.all.item('moji2').style.visibility='visible'" onmouseout="document.all.item('moji2').style.visibility='hidden'"＞ 文字♪ ＜/span＞ ＜div ID="moji2" style="visibility:hidden;"＞ 表示文字 ＜/div＞
・のせると文字の色が変わり、離すと色が戻る
＜span onmouseover="this.style.color='カラー名'"onmouseout="this.style.color='元の文字のカラー名'"＞ 対象となる文字 ＜/span＞
対象となる文字
・のせると背景色が変わる。
＜span onmouseover="this.style.background='背景色'"＞ 対象となる文字 ＜/span＞
対象となる文字
・のせると背景色が変わり、離すと背景色が戻る
＜span onmouseover="this.style.background='背景色'" onmouseout="this.style.background='ページの背景色'"＞ 文字♪ ＜/span＞
この文字にマウスをのせて下さい♪
・のせると文字の大きさが変わる
＜span onmouseover="this.style.fontSize='50'"＞文字＜/span＞
対象となる文字
・のせると文字の大きさが変わり、離すと戻る
＜span onmouseover="this.style.fontSize='50'" onmouseout="this.style.fontSize='17'"＞ 対象となる文字 ＜/span＞
対象となる文字
・のせると書体が変わる
＜span onmouseover="this.style.fontFamily='書体名'"＞ 対象となる文字 ＜/span＞
対象となる文字
・のせると書体が変わり、離すと戻る
＜span onmouseover="this.style.fontFamily='書体名'" onmouseout="this.style.fontFamily=''"＞ 対象となる文字 ＜/span＞
対象となる文字
・のせるとステータスバーに表示、離すと非表示
＜span onmouseover="status='ステータスバーの文字';return true"onmouseout="status=''"＞対象となる文字＜/span＞
対象となる文字
・のせると文字変更
＜span onmouseover="this.innerText='文字Ａ'" onmouseout="this.innerText='文字Ｂ'"＞ 文字Ｂ ＜/span＞
文字Ｂ
・のせるとページの背景色を変える　⇒　×
＜font size="3" color="文字の色" onmouseover="document.bgColor='変える背景色'"＞ この文字にマウスをのせて下さい ＜/font＞
この文字にマウスをのせて下さい
・のせるとページの背景色を変える、離すと戻る　⇒　×
＜font size="3" color="文字の色" onmouseover="document.bgColor='変える背景色'" onmouseout="document.bgColor='元の背景色'"＞ この文字にマウスをのせて下さい ＜/font＞
この文字にマウスをのせて下さい
・のせるとページの背景画像を変える、離すと戻る　⇒　×
＜span onmouseover="document.style.body.backgroundImage='url(背景にする画像URL)'" onmouseout="document.style.body.backgroundImage='url()'"＞ この文字にマウスをのせて下さい ＜/span＞
この文字にマウスをのせて下さい

【オンクリック】
・クリックすると表示　⇒　×
＜span onClick="document.all.item('moji1').style.visibility='visible'"＞ クリックする文字 ＜/span＞ ＜div ID="moji1" style="visibility:hidden;"＞ 表示される文字 ＜/div＞
クリックする文字
・クリックすると非表示
＜span onClick="this.style.visibility='hidden'"＞ 消したい文字 ＜/span＞
消したい文字
・クリックすると文字を表示、表示された文字をクリックすると非表示　⇒　×
＜span onClick="document.all.item('moji2').style.visibility='visible'" onClick="document.all.item('moji2').style.visibility='hidden'"＞ クリックする文字 ＜/span＞ ＜div ID="moji2" onClick="document.all.item('moji2').style.visibility='hidden'" style="visibility:hidden;"＞ この文字をクリックすると消えます ＜/div＞
クリックする文字
・クリックすると文字の色が変わる
＜span onClick="this.style.color='カラー名(コード)'"＞ 対象となる文字 ＜/span＞
対象となる文字
・クリックすると文字の背景の色が変わる
＜span onClick="this.style.background='背景色'"＞ 対象となる文字 ＜/span＞
対象となる文字
・クリックすると文字の大きさが変わる
＜span onClick="this.style.fontSize='50'"＞ 対象となる文字 ＜/span＞
対象となる文字
・クリックすると書体が変わる
＜span onClick="this.style.fontFamily='書体名'"＞ 対象となる文字 ＜/span＞
対象となる文字
・クリックするとステータスバーに表示
＜span onClick="status='ステータスバーの文字'"＞対象となる文字＜/span＞
対象となる文字
・クリックすると文字を変更
＜span onClick="this.innerText='文字Ａ'"＞ 文字Ｂ ＜/span＞
文字Ｂ
・クリックするとページの背景色を変更　⇒　×
＜font size="3" color="文字の色" onclick="document.bgColor='変える背景色'"＞ 対象となる文字 ＜/font＞
対象となる文字
・クリックするとページの背景画像を変更　⇒　×
＜span onclick="document.style.body.backgroundImage='url(背景にする画像URL)'"＞ この文字をクリックして下さい ＜/span＞
この文字をクリックして下さい

Webツールを使って、html表現を試す。

【文字】
■基本文字修飾：＜B,I,S,U＞文字＜/B,S,I,U＞　⇒　○
ボールド指定 斜体指定　取り消し線　アンダーライン
■フォントサイズ：＜font size="xx" color="#xxxxxx"＞文章＜/font＞
ここに文章を書いて下さい ⇒　color(○)　size(○)
■＜Span Style="font-size:32px;font-weight:bold;font-style:italic;background-color:#ff00ff;width:500;"＞　⇒　○
文字の大きさ
太字
イタリック
文字背景色の指定：＜span style="background-color:カラーコード(背景色);width:横幅;＞"
■＜Span Style="text-decolation:(underline|line-through);"＞
アンダーライン
取り消し線
■るび：＜Ruby＞＜Rb＞漢字＜Rt＞よみ＜/Ruby＞　⇒　○
美萩野 みはぎの
■タグ：＜Sub>上側文字＜/Sub＞＜Sub＞下側文字＜/Sub＞　⇒　○
^上側文字 _下側文字

【文章変化】
■縦書き：＜div style="writing-mode:tb-rl;Height:xxx;"＞縦書き文章＜/div＞
・縦書きセンタリング

変わった文章１ 縦書きの文章です。 縦書きのタグだけでは右に文章がよってしまうので テーブルタグを使って中央に文章が表示されるようにしてあります。

■右から読む文章：＜bdo dir="rtl"＞文章＜/bdo＞
ここに右から読む文章を書いてください。
・文字修飾も可能

Geeklogの編集機能は多種多様

■上下反転文字：＜span style="...;filter:flipV"＞
上下反転文字

■文字を動かす。：＜Marquee＞文章＜/Marquee＞
ここに文字を動かす文章を書いて下さい
・左から右へ：＜Marquee direction="right">文章＜/Marquee＞
ここにひだりから右へ動く文章を書いてください
・左右に：＜Marquee behavior="alternate">文章＜/Marquee＞
ここに文章を書いてください
・指定範囲で動かす：＜marquee width="400"＞文章＜/marquee＞
ここに文章を書いて下さい
・ゆっくり動かす：＜marquee scrollamount="2" truespeed＞文章＜/marquee＞
ここに文章を書いて下さい
・速く動かす：＜marquee scrollamount="100" truespeed＞文章＜/marquee＞
ここに文章を書いて下さい
・上へ動かす：＜marquee direction="up" width="100" height="100" scrollamount="10" truespeed＞文章＜/marquee＞
ここに文章を書いて下さい
・下へ動かす：＜marquee direction="down" height="100" width="100" scrollamount="10" truespeed＞文章＜/marquee＞
ここに文章を書いて下さい
・上下に動く：＜marquee height="50" width="100" behavior="alternate" direction="up" scrollamount="10" truespeed＞文章＜/marquee＞
ここに文章を書いて下さい
・背景色付き：＜marquee bgcolor="カラーコード">文章＜/marquee＞
ここに文章を書いて下さい
・並行に何行も流れる：＜marquee＞１行目＜Br＞２行目＜Br＞３行目＜/marquee＞
１行目
２行目
３行目
・上下に動きながら右に進む：＜marquee behavior="alternate" direction="up" height="50"＞＜marquee direction="right"＞文章＜/marquee＞＜/marquee＞
ここに文章を書いて下さい
・上下に動きながら左に進む：＜marquee behavior="alternate" direction="up" height="50"＞＜marquee direction="left"＞文章＜/marquee＞＜/marquee＞
ここに文章を書いて下さい
【フィルター文字】　⇒　×
・＜span style="....;filter:ｘｘｘｘｘ;"＞文章＜/span＞は機能しないようだ