サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ノーベル賞
tategaki.info
h2vR.js 「より簡単に」 「より柔軟に」 ウェブページで縦書き表示を実現するJavaScript "h2v.js" をリニューアルしてみました。 設置・設定方法や動作を今までより簡素化することにより、 レスポンシブデザインを採用しているページヘの設置が容易に。 WordPress や Movable Type などへの設置がより簡単に。 …という具合になっています。「これから縦書きウェブページを作ってみよう」と思っているならば、ぜひ h2vR.js をお試しください。 使い方は簡単です。 h2vR.js と h2vR.css をドキュメントに読み込んで、 適宜スタイルを指定して、 縦書きにしたいエリアに特別なクラス名を設定する。 …と、それだけです。 h2vR.js では、テキストだけでなく、縦書きエリア内の画像やブロック要素なども適切にレイアウトします。そのため、縦書き表示にあたっ
レスポンシブデザインを採用したページヘの設置を想定した h2vR.js を公開しました。 従来の h2v.js とは設定方法が異なります。 詳細は こちら をご覧ください。 このサイトは、主要なウェブブラウザ上で縦書きレイアウトを実現できるJavaScript・h2vR.js および レガシーバージョン h2v.jsのメインサイトです。 Webページを縦書きに! 縦書きのホームページを作ってみたい…と思ったことはありませんか。 ウェブページで縦書き表示を実現する JavaScript・h2vR.js および h2v.js が、その思いをサポートします。 h2vR.js 縦書きレイアウト実現のための JavaScript "h2vR.js" は、レスポンシブデザインを採用しているページへの対応を強化したバージョンです。 普通に(横書きで)html コーディングしたページ内の指定したエリアを自
…というわけで、このスタイルシートでは不満だ…というときは、より簡単に、綺麗な縦書きレイアウトを実現できるJavaScript・h2v.jsをお試しください。 さて、どういうスタイルを適用しているかといいますと、 文を一行ごとに、幅が一文字分の<div>要素で括る。 句読点や小さい「っ」は、放っておくと日本語の禁則処理で前の文字の真横に表示されるので、スタイルシートで禁則処理を外すように指定。 さらに、このままだと句読点などの位置が気持ち悪いので、<span>で括って表示位置を調整。 横書きと縦書きで字形が異なる記号など(括弧や長音記号、〜や…など)は、90度回転させて表示。 …まぁ、それだけなのですが。 FireFox / Safari / Chrome / Opera / IEの各ブラウザで、なんとなく良い感じに表示されます。非常に古いバージョンのブラウザの場合、綺麗に表示されないこと
★ 特に理由がない場合はh2vR.jsの利用をおすすめします。 主要なブラウザ上で、簡単に、軽快に、日本語の縦書きレイアウトを実現する JavaScript ・ h2v.js の概要を紹介します。 【重要:2016.07.22】:
縦書きレイアウト用スタイルシートです。JavaScriptなどを使用せず、スタイルシートのみで縦書きを実現できます。 縦書きWebレイアウト用のスタイルシート "tate-style.css"です。コピーしてお使いください。 ※ 2013.03.27 font-family設定をアップデート。 ※ 2011.07.03 細か〜い修正をしました。詳しくは → こちらで。 @charset 'UTF-8'; /* 縦書きレイアウト用スタイルシート tate-style.css last updated : Mar 27 , 2013 tyz@freefielder.jp http://freefielder.jp http://tategaki.info/ */ div.tate-area{ float:right; font-size:12pt; } div.tate-area a{ col
しおりは 5件 まで登録できます。 既に 5件 登録済みの場合は、不要な しおり を削除してから新規追加してください。 しおりリスト:まだ登録されていません 削除 削除 削除 削除 削除
このページを最初にブックマークしてみませんか?
『ウェブページで縦書きレイアウト - tategaki.info』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く