CSS 構文 transform (変形)

投稿者marine プレイ回数63
難易度(3.5) 1146打 長文 英字 タグcss 暗記用 プログラミング transform
css 3 暗記用です。
要素の移動・拡大・縮小・傾斜・回転や立体的な表現もできるtransformプロパティー♪
animationとセットで使いこなせるようになりたいですね〜。
順位名前スコア称号打鍵/秒正誤率時間(秒)打鍵数ミス問題日付
1 mh 1996 頑張ったね! 2.0 97.5% 559.5 1146 29 42 2020/03/27

関連タイピング

Javaの予約語

Javaの予約語

プレイ回数9450
短文英字289打
プログラマー的タイピングマスターの道:初級①

プログラマー的タイピングマスターの道:初級①

タイピングをマスターしたい方向けの問題です。

プレイ回数4985
長文302打
C言語写経

C言語写経

C言語を写経で覚える

プレイ回数518
英語長文1313打
プログラマー的タイピングマスターの道:中級④

プログラマー的タイピングマスターの道:中級④

タッチタイピングを本当にマスターしたい方向けの問題です。

プレイ回数1303
長文英字366打
Linux+Bashコマンド

Linux+Bashコマンド

Linux+Bashコマンド。数字と記号を全て含んでいます。

プレイ回数263
英語長文305打
プログラマー的タイピングマスターの道:中級③

プログラマー的タイピングマスターの道:中級③

タッチタイピングをマスターしたい方向けの問題です。

プレイ回数1327
長文英字411打

問題文

ふりがな非表示 ふりがな表示

(transform-style:flat;)

transform-style:flat;

(transform-style:preserve-3d;)

transform-style:preserve-3d;

(perspective:500px;)

perspective:500px;

(transform:translate(10px,20px);)

transform:translate(10px,20px);

(transform:translateX(30%);)

transform:translateX(30%);

(transform:translateY(-40px);)

transform:translateY(-40px);

(transform:translateZ(50px);)

transform:translateZ(50px);

(transform:translateZ(-60px);)

transform:translateZ(-60px);

(transform:translate3d(70%,80%,-90px);)

transform:translate3d(70%,80%,-90px);

(transform:rotate(0.5turn);)

transform:rotate(0.5turn);

(transform:rotate3d(1,2,3,10deg);)

transform:rotate3d(1,2,3,10deg);

(transform:rotateX(-0.8turn);)

transform:rotateX(-0.8turn);

(transform:rotateY(10deg);)

transform:rotateY(10deg);

(transform:rotateZ(10deg);)

transform:rotateZ(10deg);

(transform:scale(0.5,1);)

transform:scale(0.5,1);

(transform:scaleX(1.5);)

transform:scaleX(1.5);

(transform:scaleY(2);)

transform:scaleY(2);

(transform:scaleZ(2.5);)

transform:scaleZ(2.5);

(transform:scale3d(3,3.5,4);)

transform:scale3d(3,3.5,4);

(transform:skewX(30deg);)

transform:skewX(30deg);

など

(transform:skewY(40deg);)

transform:skewY(40deg);

(transform:skew(-10deg,-20deg);)

transform:skew(-10deg,-20deg);

(transform:translate3d(10px,20px,30px) rotateY(40deg);)

transform:translate3d(10px,20px,30px) rotateY(40deg);

(transform-origin:2px;)

transform-origin:2px;

(transform-origin:bottom;)

transform-origin:bottom;

(transform-origin:left 2px;)

transform-origin:left 2px;

(transform-origin:right top;)

transform-origin:right top;

(transform-origin:right top;)

transform-origin:right top;

(transform-origin:2px 30% 10px;)

transform-origin:2px 30% 10px;

(transform-origin:left 5px -3px;)

transform-origin:left 5px -3px;

(transform-origin:right bottom 20px;)

transform-origin:right bottom 20px;

(transform-origin:50% 50% 0;)

transform-origin:50% 50% 0;

(perspective-origin:50% 50%;)

perspective-origin:50% 50%;

(perspective-origin:left top;)

perspective-origin:left top;

(perspective-origin:top;)

perspective-origin:top;

(perspective-origin:right top;)

perspective-origin:right top;

(perspective-origin:left;)

perspective-origin:left;

(perspective-origin:right;)

perspective-origin:right;

(perspective-origin:left bottom;)

perspective-origin:left bottom;

(perspective-origin:bottom;)

perspective-origin:bottom;

(perspective-origin:right bottom;)

perspective-origin:right bottom;

(perspective-origin:200% -200%;)

perspective-origin:200% -200%;

問題文を全て表示 一部のみ表示 誤字・脱字等の報告

◆コメントを投稿

※公序良俗に反するコメントや、他者を中傷するようなコメントはしないでください。
※このゲームにコメントするにはログインが必要です。

marineのタイピング

オススメの新着タイピング

タイピング練習講座 ローマ字入力表

人気ランキング

注目キーワード