タテ長モードプロパティテスト

2ボタンを押してタテ長モードにして、CSSのプロパティが動作するかどうかテストします。

背景を整える

background
background-attachment
background-color
background-image
background-position
background-repeat

ボーダー(罫線)を整える

dotted

dashed

solid

double

groove

ridge

inset

outset

border
border-color
border-style
border-top border-right border-bottom border-left
border-top-color border-right-color border-bottom-color border-left-color
border-top-style border-right-style border-bottom-style border-left-style
border-top-width border-right-width border-bottom-width border-left-width
border-width
outline
outline-color
outline-style
outline-width

マージンとパディング

margin-top: 100px; margin-right: 100px; margin-bottom: 100px; margin-left: 100px;
padding-top: 100px; padding-right: 100px; padding-bottom: 100px; padding-left: 100px;

フロートとクリア

指定無しブロック

ポジション

static
relative
absolute
fixed

表示

inline
block
list-item
block
run-in
↓この下にnoneがあります
none
inline-table
table-caption
table-row-group
table-header-group
table-row
table-column-group
table-column
table-cell
インライン
table-caption
table-cell
table-cell
table-cell
table-cell
table-column-group
table-column
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-column-group
table-column
のテーブル
ブロックの
table-caption
table-cell
table-cell
table-cell
table-cell
table-column-group
table-column
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-cell
table-column-group
table-column
テーブル

visiblity

visible/↓hiddenがあります
collapse
テスト1テストテストテスト
テスト2テストテストテスト
テスト3テストテストテスト
テスト4テストテストテスト

ボックスのサイズ

Max
Minimum
Auto
30代になっても結婚できない、あるいは結婚しない男性が増えているのは周知の通りであるが、  それ以前の問題として、目の前に立ちはだかる「恋愛」という名の壁の前で立ち尽くし、もがいている  男性も多いという。  もちろん、「恋愛」というものは、単純にこちら側の意思だけではどうにもならず、様々な条件や  事象が複雑に絡み合った後に成立するものだということは重々分かっている。しかし、そのスタート  地点にすら立つことが出来ない30代男性が増えているというのだ。  ここで勘違いしないでほしいのは、「今まで一度も女性と付き合ったことない」とか「ぶっちゃけ、風俗嬢しか  経験なし」なんてのたまっている男性が対象の話ではないということ。外見的にも決して女性に嫌われる  ようなタイプではないし、きちっとした仕事も持っているし、変な性癖とかを持っているわけでもない、  ごく普通の立派な成人男性なのである。そんな彼らが今更ながら「女性の口説き方がわからない」とか  「どうやって恋愛を始めればいいのかわからない」なんて言っているというのである。

This is Times,serif.

プロポーショナルゴシックの文字です。Wii NTLG PGothic. 0123456789

等幅ゴシックの文字です。Wii NTLG Gothic. 0123456789

文字を重ねて見てみるよ。123一二三ABCabc123

文字を重ねて見てみるよ。123一二三ABCabc123

variant abcdefgABCDEFG

variant abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-stretch abcdefgABCDEFG123456あいうえお

font-weight abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-oblique abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-italic abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-weight&oblique abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-weight&font-italic abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

font-color abcdefgABCDEFG123456あいうえお人類普遍魑魅魍魎

direction 人類普遍魑魅魍魎

text-align:left 人類普遍魑魅魍魎

text-align:center 人類普遍魑魅魍魎

text-align:right 人類普遍魑魅魍魎

text-align:right 人類普遍魑魅魍魎

underline 人類普遍魑魅魍魎

overline 人類普遍魑魅魍魎

line-through 人類普遍魑魅魍魎

text-indent 人類普遍魑魅魍魎

capitalize. giant robo ジャイアントロボ 123

uppercase. giant robo ジャイアントロボ 123

lowercase. GIANT ROBO ジャイアントロボ 123

letter-spacing. GIANT ROBO ジャイアントロボ 123 人類普遍の魑魅魍魎

word-spacing. GIANT ROBO ジャイアントロボ 123 人類普遍の魑魅魍魎

white-spacing:pre 菓子パンから針が見つかったと会社員女性(28)が製パン会社を介して香川県警高松北署に  通報した事件で、女性が「自分で入れました」と自作自演を認めていることが4日、分かった。

white-spacing:nowrap 菓子パンから針が見つかったと会社員女性(28)が製パン会社を介して香川県警高松北署に  通報した事件で、女性が「自分で入れました」と自作自演を認めていることが4日、分かった。

white-spacing:pre-wrap 菓子パンから針が見つかったと会社員女性(28)が製パン会社を介して香川県警高松北署に  通報した事件で、女性が「自分で入れました」と自作自演を認めていることが4日、分かった。

white-spacing:pre-line 菓子パンから針が見つかったと会社員女性(28)が製パン会社を介して香川県警高松北署に  通報した事件で、女性が「自分で入れました」と自作自演を認めていることが4日、分かった。

テーブル

collapse
テスト1テストテストテストテストテスト
テスト2テストテストテスト
テスト3テストテスト
テスト4テストテストテスト

カーソル

crosshair

default

pointer

move

e-resize

ne-resize

nw-resize

n-resize

se-resize

sw-resize

s-resize

w-resize

text

wait

help

progress

vertical-align

縦方向のああああああああ位置を決めます。

content

あいうえおかきくけこさしすせそ

あいうえおかきくけこさしすせそ

あいうえおかきくけこさしすせそ

あいうえおかきくけこさしすせそ

あいうえおかきくけこさしすせそ

あいうえおかきくけこさしすせそ