七鍵@楽天

PR

×

コメント新着

k.kyouka @ すきやき占い 『しいたけ』の重要度27% 『しいたけ』…
なな@ Re:迷っています(11/01) レオ がいいですよ☆★
マロン@ かわいい キュート
foolish☆foo @ Re[1]:お久しぶりです。(07/15) >実演を踏まえてテストをしておりました…

バックナンバー

Aug , 2026
Jul , 2026
Jun , 2026

フリーページ

タグ辞書【A】


タグ辞書【ABBR】


タグ辞書【ACRONYM】


タグ辞書【ADDRESS】


タグ辞書【APPLET】


タグ辞書【AREA】


タグ辞書【B】


タグ辞書【BASE】


タグ辞書【BASEFONT】


タグ辞書【BDO】


タグ辞書【BGSOUND】


タグ辞書【BIG】


タグ辞書【BLINK】


タグ辞書【BLOCKQU…】


タグ辞書【BODY】


タグ辞書【BR】


タグ辞書【BUTTON】


タグ辞書【CENTER】


タグ辞書【CITE】


タグ辞書【CODE】


タグ辞書【COL】


タグ辞書【COLGROUP】


タグ辞書【COMMENT】


タグ辞書【CAPTION】


タグ辞書【DD】


タグ辞書【DEL】


タグ辞書【DFN】


タグ辞書【DIR】


タグ辞書【DIV】


タグ辞書【DL】


タグ辞書【DT】


タグ辞書【EM】


タグ辞書【EMBED】


タグ辞書【FIELDSET】


タグ辞書【FONT】


タグ辞書【FORM】


タグ辞書【FRAME】


タグ辞書【FRAMESET】


タグ辞書【H】


タグ辞書【HEAD】


タグ辞書【HR】


タグ辞書【HTML】


タグ辞書【I】


タグ辞書【IFRAME】


タグ辞書【ILAYER】


タグ辞書【IMG】


タグ辞書【INPUT】


タグ辞書【INS】


タグ辞書【ISINDEX】


タグ辞書【KBD】


タグ辞書【LABEL】


タグ辞書【LAYER】


タグ辞書【LEGEND】


タグ辞書【LI】


タグ辞書【LINK】


タグ辞書【LISTING】


タグ辞書【MAP】


タグ辞書【MARQUEE】


タグ辞書【MENU】


タグ辞書【META】


タグ辞書【MULTICOL】


タグ辞書【NOBR】


タグ辞書【NOEMBED】


タグ辞書【NOFRAMES】


タグ辞書【NOLAYER】


タグ辞書【NOSCRIPT】


タグ辞書【OBJECT】


タグ辞書【OL】


タグ辞書【OPTGROUP】


タグ辞書【OPTION】


タグ辞書【P】


タグ辞書【PARAM】


タグ辞書【PLAINTEXT】


タグ辞書【PRE】


タグ辞書【Q】


タグ辞書【RB】


タグ辞書【RP】


タグ辞書【RT】


タグ辞書【RUBY】


タグ辞書【S】


タグ辞書【SAMP】


タグ辞書【SCRIPT】


タグ辞書【SELECT】


タグ辞書【SMALL】


タグ辞書【SPACER】


タグ辞書【SPAN】


タグ辞書【STRIKE】


タグ辞書【STRONG】


タグ辞書【STYLE】


タグ辞書【SUB】


タグ辞書【SUP】


タグ辞書【TABLE】


タグ辞書【TBODY】


タグ辞書【TD】


タグ辞書【TEXTAREA】


タグ辞書【TFOOT】


タグ辞書【TH】


タグ辞書【THEAD】


タグ辞書【TITLE】


タグ辞書【TR】


タグ辞書【TT】


タグ辞書【U】


タグ辞書【UL】


タグ辞書【VAR】


タグ辞書【WBR】


タグ辞書【XMP】


タグ辞書【コメントアウト】


タグ辞書【!DOCTYPE】


piyo


サンプル


HP作成のためのコラム


スタイルシートをゼロからお勉強


HTMLタグに挑戦


Aug 22, 2004
XML
カテゴリ: タグ教室
今回は文章を縦書きに表示するテクニックを紹介します。
Webページは横書き・・・というのが一般的ではありますが
日本人ならやっぱり縦書きでしょ( ̄▽ ̄人)
とか言いつつも、私のページはしっかり横書きですが(笑

では早速例を・・・

例)
私<br>は<br>か<br>も<br>め<br>

表示結果)






だまされたみたいなテクニックですね(´・ω・`)
テクニックとも呼べないと言いますか・・・
ただこの方法が、どんな環境でも思い通りに文章を縦書きにできる
現在唯一の方法となっています。

ただこれではあんまりですので
もう一つ例を(〃⌒▽⌒)

例)
<p style="writing-mode:tb-rl;">

http://www.7key.jp/に掲載している情報は、
http://www.7key.jp/がその内容を必ずしも保証するものではありません。
情報の活用は利用者各自の責任の範囲内でお願いいたします。
詳細は「取扱注意」を参照ください。
</p>



http://www.7key.jp/はリンクフリーです。
http://www.7key.jp/に掲載している情報は、
http://www.7key.jp/がその内容を必ずしも保証するものではありません。
情報の活用は利用者各自の責任の範囲内でお願いいたします。
詳細は「取扱注意」を参照ください。



どうでしょう?
おもしろいでしょ(〃⌒▽⌒)
読みやすいように英字は向きまで変えてくれて、「」の向きもしっかり縦書きになっています。
カーソルをあわせてもらうとカーソルも縦書き用にしっかりなりますよね(〃⌒▽⌒)
ただ、残念なことにこのタグが使用できるのはIE5以上のみとなっています。
他のブラウザではしっかり横書きで表示されますので、
見る人全員が同じように見えるってわけではありません。
まぁ、現在正式にタグとして採用するかどうか審議中ってことですので・・・
近い将来、全てのブラウザで縦書きが使えるようになるかもしれませんね(〃⌒▽⌒)

では、また明日ー(゚▽^*)ノ⌒☆






お気に入りの記事を「いいね!」で応援しよう

最終更新日  Aug 22, 2004 02:36:44 AM
コメント(19) | コメントを書く
[タグ教室] カテゴリの最新記事


■コメント

お名前
タイトル
メッセージ
画像認証
上の画像で表示されている数字を入力して下さい。


利用規約 に同意してコメントを
※コメントに関するよくある質問は、 こちら をご確認ください。


おぉ~ヽ(*⌒∇⌒*)ノ  
RainbowAngel  さん
こんなのが出来るのね~♪
凄い凄い~\(≧▽≦)丿\(≧▽≦)丿

将来、本を書く時に役立ちそうね♪…って、
本書く時があるのかどうかわかんないけどね
ふふふ(; ̄ー ̄)
(Aug 22, 2004 07:23:09 AM)

Re:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
早速質問に答えてくださり有難うございました。昨日のも私も「違いの分かる女」になれました。有難う御座いました。さて、またもや質問です。
えっと、HPの更新した箇所をトップページの所で一目で分かるようにしるしを出したいときはどうしたらいいですか? (Aug 22, 2004 10:45:09 AM)

ホームページ作成内職詐欺に合い  
miranoinu  さん
色々疑問があっても誰に聞いてよいか分からない、詐欺師会社と70万円以上のローンを組んで変な本だけ送って来た!!まんまと騙されたと分かった時、自分のあさはかさに呆れるばかり、笑ってやって下さい、本当はまじめにタグを覚えたい!! (Aug 23, 2004 07:16:04 PM)

Re:おぉ~ヽ(*⌒∇⌒*)ノ(08/22)  
#七鍵  さん
RainbowAngelさん

すごいでしょー(〃⌒▽⌒)
少しは見直した?
ふふふ(〃⌒▽⌒)

本を書くとき・・・くるの?(笑
ぜひそのときはこのテクニックを使ってねー(〃⌒▽⌒)

(Aug 24, 2004 12:00:11 AM)

Re[1]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いえいえー(〃⌒▽⌒)
お役に立ててよかったです( ̄▽ ̄人)

今回の質問ですが・・・
難しいですね(´・ω・`)
楽天のトップ自由欄にリンク付で派手目に表示するくらいしか思いつかないのですが・・・

楽天外でしたらJavaScriptなど使って何とでも方法あるのですが・・・
あまりお役に立てず申し訳ないです(´・ω・`)

(Aug 24, 2004 12:03:06 AM)

Re:ホームページ作成内職詐欺に合い(08/22)  
#七鍵  さん
miranoinuさん

いらっしゃいませー(〃⌒▽⌒)
内職詐欺ですか(´・ω・`)
説教くさくなるかもしれませんが、嫌でなければ耳を傾けて下さい。

何事を学習するにもお金を払ってはだめです。
誰かに習ってもだめです。
誰かに頼ってもだめです。

こんなこと言ってたらこのサイトの存在価値がなくなりますが(´・ω・`)
私はこうしてHP作成を覚えました。
今では微妙に仕事になっています。

もちろん、本を買ったこともありますし、詳しい方に教えてもらったこともありますよ。
けど、一番身に着く学習方法はやっぱり自分で試して、自分でそこら中探して・・・
自習した内容は絶対忘れません。

最近はインターネットが発達して何を調べるにも困らないご時世になりました。
お金を払うなんてもっての他です。
このサイトがmiranoinuさん の学習するきっかけとなれば幸いです( ̄▽ ̄人)

# このサイトは完全無料ですので安心して訪問ください(笑

(Aug 24, 2004 12:10:39 AM)

Re[2]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん
>な~~るさん

>いえいえー(〃⌒▽⌒)
>お役に立ててよかったです( ̄▽ ̄人)

>今回の質問ですが・・・
>難しいですね(´・ω・`)
>楽天のトップ自由欄にリンク付で派手目に表示するくらいしか思いつかないのですが・・・

>楽天外でしたらJavaScriptなど使って何とでも方法あるのですが・・・
>あまりお役に立てず申し訳ないです(´・ω・`)
-----
有難う御座います。それでは、そのリンクの方法というのは・・どういうのなんでしょう?
よければ教えてねっ (Aug 24, 2004 06:38:02 AM)

Re[3]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いらっしゃいませー(〃⌒▽⌒)
例えばですね・・・

http://plaza.rakuten.co.jp/hacdic/diary/200408200000/
のテクニックを使って更新履歴をトップに作るとか・・・

http://plaza.rakuten.co.jp/hacdic/diary/200408160000/
のテクニックを使って・・・
更新履歴を作るとか(笑

もう後は好みと表示位置の問題だと思いますよ(〃⌒▽⌒)
なるべく派手目になるべく目立つ場所に配置すれば
訪問してくれた方の目にとまるでしょうねー。
更新ページへのハイパーリンクも忘れずにね(〃⌒▽⌒)

(Aug 25, 2004 12:34:07 AM)

Re[3]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

このページのトップに・・・

なるべく派手で
なるべく目立つ場所

の条件を満たす枠を作ってみました(笑
気に入ったらソースから持ってってください(゚▽^*)ノ⌒☆

(Aug 25, 2004 01:08:41 AM)

Re[4]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん

何度もご親切に有難う御座いました。
それなのに、お礼が大分遅れてしまいまして、
本当にごめんなさい。
早速、色々とためさせていただいております。
結構、派手好きなのか、動くものとか、大好きです。(^_^;)

度々、お聞きしてすみませんが、
絵の上に字を書く場合は、
どうしたらいいのでしょう?
インラインフレームもどきのタグを、
ちょっと書き換えるだけなのでしょうか??

よく見たつもりなのですが・・
みつかりません(・_・、)"
よければ、教えてください。
お願いばかりですみません。(^^;)ゞ
(Aug 28, 2004 08:51:07 AM)

Re[5]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いらっしゃいませー(〃⌒▽⌒)

絵の上に文字を書く方法ですが・・・

<table border=0><tr>
<td style="width:200px;height:200px;background-repeat: no-repeat;background-image:url( http://www.7key.jp/img/rogo.jpg )">
ここに文字を記入してね(゚▽^*)ノ⌒☆
</td>
</tr></table>

が一番使いやすいと思いますよ(〃⌒▽⌒)

background-image:url( http://www.7key.jp/img/rogo.jpg )でテーブルセルの背景画像を指定し、
background-repeat: no-repeat;で背景は繰り返さず一回だけ表示してね、って指定をします。
プラス、画像が途中で切れてしまわないように
width:200px;height:200px;
のようにセルの幅と高さを調整してやれば・・・
できると思いますよ( ̄▽ ̄人)

チャレンジしてみてくださいな(〃⌒▽⌒)

(Aug 28, 2004 09:29:29 PM)

Re[6]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん
-----
有難う御座います。さっそくやってみますっ。
(^^) (Aug 29, 2004 01:49:08 AM)

Re[6]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん

-----
ごめんなさい。何が悪いのか「styleの属性の記述が正しくありません」と出たのですが、何が悪かったのか分かりません。
スペースとかでも、エラーになっちゃいますよね?
コピーしたのですが、旨くいきません。
どういうところに注意したらよいか教えてください。 (Aug 29, 2004 02:23:54 AM)

Re[7]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いらっしゃいませー(〃⌒▽⌒)

コピペしたら失敗しました(´・ω・`)
いろいろ試してみた結果・・・
画像のパスの前後の空白ありますよね?
あれがだめだったみたいです。
消してチャレンジしてみて下さい(〃⌒▽⌒)
少し例が悪いですが・・・

http://plaza.rakuten.co.jp/hacdic/055000

にサンプルを載せておきました(〃⌒▽⌒)

(Aug 29, 2004 06:38:27 AM)

Re[8]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん
-----
どうも有難うございました。
配置で凄い手間取りましたが、
なんとか、かんとか、それっぽくはなりました。(^^;)ゞ
どうも有難う御座いました。
又、頼らせていただきますので
(しかも、いつも一方的ですけど)
よろしくお願いします。 (Aug 29, 2004 03:46:40 PM)

Re[9]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いらっしゃいませー(〃⌒▽⌒)

配置はどうしても手間取るもんですよ(´・ω・`)
ちょっとずつ微調整しながら値を変えて・・・
これでもか、これでもかって感じで(笑

でもできて何よりです( ̄▽ ̄人)
また分からないことありましたら遠慮なくどうぞー(゚▽^*)ノ⌒☆

(Aug 29, 2004 04:26:26 PM)

Re[10]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん

-----
優しいお言葉有難う御座います。(^^;)ゞ
これからも、頼らせていただきますよ~ん。
・・と、いう事で、絵を同じところで、
まわすことって出来ますでしょうか??

いつもより多く回っておりま~す・・みたいな・・かんじ・・。
無理でしょうか?(^_^;)

(Aug 30, 2004 01:08:43 AM)

Re[11]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
#七鍵  さん
な~~るさん

いらっしゃいませー(〃⌒▽⌒)

絵を回す・・・ですか?
JavaScriptなるものを使えばできるのですが、
ご存知の通り楽天ではJavaScriptの使用が禁止されています。
なんで、残る手段は「アニメーションGIF」を使うしかないでしょうね。
俗に言いますパタパタアニメのような画像なんですがご存知でしょうか?
Gif画像を何枚か重ねて・・・ぱらぱらぱらーのようにして動かす画像のことなんですがね。
専用のソフトなど使いますと割かし簡単にできるのですが、
複数の画像を重ねあわせる関係上容量が重たくなってしまいます。
容量が大きすぎても楽天では使えませんよね。

結局のところ・・・
方法が無いではないが楽天では現実的でない・・・
ってことでしょうか(´・ω・`)

(Aug 30, 2004 01:19:32 AM)

Re[12]:タグを覚えよう【第16回目】 - 文章を縦書きにしてみよう(08/22)  
な~~る  さん
#七鍵さん
-----
なるほど・・。javaって凄いんですね。
パタパタアニメみたいのは、最近知りました。└┤TヘT├┘
いろいろあるのね。 (Aug 30, 2004 08:33:49 PM)

【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x
X

© Rakuten Group, Inc.
Design a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: