CSSサンプル - CSSを使ったテキストの回転

2011/03/15 04:07Update
TAGS: CSS | サンプル | 回転 | rotate

CSSでテキストの回転表示を実装する方法。

CSS例：
/* Safari */ -webkit-transform: rotate(-90deg);

※Safariブラウザーの回転方法

/* Firefox */ -moz-transform: rotate(-90deg);-moz-transform-origin: 20px 0px;  

※Firefoxブラウザーの回転方法

/* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);cursor:pointer;

※IEブラウザーの回転方法。rotation属性：0, 1, 2, 3（回転：0, 90, 180 or 270度）

表示例：


HTMLファイルはこちら【見る】
test.html

参考資料


Text Rotation with CSS - Snook.ca

有关作者
Syboos.jp編集長AJavaやオープンソース情報の執筆、Webサイトの開発や運営全般の業務に携わる。

Sponsored Link


Comments

用户名 (required)

Email (will not be published) (required)

URL

Evaluation

  • Relative Articles