CSS初級2(Progate編)
Progateの復習用
個人用としてProgateの復習として作りました。
CSS初級編での流れをタイピングでやる事により、実践的に内容を覚える事ができます。
こちらは、CSS初級1(Progate編)の続きとなります。
CSS初級編での流れをタイピングでやる事により、実践的に内容を覚える事ができます。
こちらは、CSS初級1(Progate編)の続きとなります。
関連タイピング
-
自作のハンバーガーメニューを作成しましょう！
プレイ回数4599 英語長文721打 -
だれでも、正しいタッチタイピングが出来るようになる練習
プレイ回数5693 英字30打 -
同時押しタイプ反復練習用
プレイ回数2563 長文かな300秒 -
同時押しタイプ反復練習用
プレイ回数1721 長文かな300秒 -
emmetのための備考欄
プレイ回数1052 短文英字201打 -
単語の初級です
プレイ回数2566 短文かな93打 -
単語タイピング初級編！！！！！！！！！！
プレイ回数5161 短文かな491打 -
ひらがな4文字程度の二字熟語や言葉が出題されます。
プレイ回数424 短文かな60秒
問題文
ふりがな非表示
ふりがな表示
(．ｃｏｎｔｅｎｔｓ－ｉｔｅｍ ｛｝)
.contents-item {}
(ｆｌｏａｔ： ｌｅｆｔ；)
float: left;
(ｍａｒｇｉｎ－ｒｉｇｈｔ： ４０ｐｘ；)
margin-right: 40px;
(．ｃｏｎｔｅｎｔｓ－ｉｔｅｍ ｐ ｛｝)
.contents-item p {}
(ｆｏｎｔ－ｓｉｚｅ： ２４ｐｘ；)
font-size: 24px;
(ｍａｒｇｉｎ－ｔｏｐ： ３０ｐｘ；)
margin-top: 30px;
(．ｃｏｎｔａｃｔ－ｆｏｒｍ ｛｝)
.contact-form {}
(ｐａｄｄｉｎｇ－ｔｏｐ： １００ｐｘ；)
padding-top: 100px;
(ｉｎｐｕｔ， ｔｅｘｔａｒｅａ ｛｝)
input, textarea {}
(ｗｉｄｔｈ： ４００ｐｘ；)
width: 400px;
(ｍａｒｇｉｎ－ｔｏｐ： １０ｐｘ；)
margin-top: 10px;
(ｍａｒｇｉｎ－ｂｏｔｔｏｍ： ３０ｐｘ；)
margin-bottom: 30px;
(ｐａｄｄｉｎｇ： ２０ｐｘ；)
padding: 20px;
(ｆｏｎｔ－ｓｉｚｅ： １８ｐｘ；)
font-size: 18px;
(ｂｏｒｄｅｒ： ｓｏｌｉｄ １ｐｘ ＃ｄｅｅ７ｅｃ；)
border: solid 1px #dee7ec;
(．ｃｏｎｔａｃｔ－ｓｕｂｍｉｔ ｛｝)
.contact-submit {}
(ｂａｃｋｇｒｏｕｎｄ－ｃｏｌｏｒ： ＃ｄｅｅ７ｅｃ；)
background-color: #dee7ec;
(ｃｏｌｏｒ： ＃８８９ｅａｂ；)
color: #889eab;
(．ｆｏｏｔｅｒ ｛｝)
.footer {}
(ｂａｃｋｇｒｏｕｎｄ－ｃｏｌｏｒ： ＃２ｆ５１６７；)
background-color: #2f5167;
など
(ｃｏｌｏｒ： ＃ｆｆｆ；)
color: #fff;
(ｈｅｉｇｈｔ： １２０ｐｘ；)
height: 120px;
(ｐａｄｄｉｎｇ： ４０ｐｘ；)
padding: 40px;
(．ｆｏｏｔｅｒ－ｌｏｇｏ ｛｝)
.footer-logo {}
(ｆｌｏａｔ： ｌｅｆｔ；)
float: left;
(ｆｏｎｔ－ｓｉｚｅ： ３２ｐｘ；)
font-size: 32px;
(．ｆｏｏｔｅｒ－ｌｉｓｔ ｛｝)
.footer-list {}
(ｆｌｏａｔ： ｒｉｇｈｔ；)
float: right;
(．ｆｏｏｔｅｒ－ｌｉｓｔ ｌｉ ｛｝)
.footer-list li {}
(ｐａｄｄｉｎｇ－ｂｏｔｔｏｍ： ２０ｐｘ；)
padding-bottom: 20px;
(ｈｔｍｌ，ｃｓｓ１，ｃｓｓ２をたっせいしたならしょきゅうせいは！)
HTML,CSS1,CSS2を達成したなら初級制覇!