CSS初級1(Progate編)

背景
投稿者投稿者ＴＡＫＥＹＡＮ  いいね1  お気に入り登録1
プレイ回数749  難易度(3.2) 561打 長文
タグタイピング練習 CSS 初級 Progate 復習 練習
Progate復習用
個人用としてProgateの復習として作りました。
CSS初級編での流れをタイピングでやる事により、実践的に内容を覚える事ができます。
CSS初級2(Progate編)へと続きます。

関連タイピング

関連タイピング一覧

問題文

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

(ｂｏｄｙ　｛｝)

body {}

(ｆｏｎｔ－ｆａｍｉｌｙ：　”ａｖｅｎｉｒ　ｎｅｘｔ”；)

font-family: "Avenir Next";

(ｌｉ　｛｝)

li {}

(ｌｉｓｔ－ｓｔｙｌｅ：　ｎｏｎｅ；)

list-style: none;

(．ｈｅａｄｅｒ　｛｝)

.header {}

(ｂａｃｋｇｒｏｕｎｄ－ｃｏｌｏｒ：　＃２６ｄ０ｃ９；)

background-color: #26d0c9;

(ｃｏｌｏｒ：　＃ｆｆｆ；)

color: #fff;

(ｈｅｉｇｈｔ：　９０ｐｘ；)

height: 90px;

(．ｈｅａｄｅｒ－ｌｏｇｏ　｛｝)

.header-logo {}

(ｆｌｏａｔ：　ｌｅｆｔ；)

float: left;

(ｆｏｎｔ－ｓｉｚｅ：　３６ｐｘ；)

font-size: 36px;

(ｐａｄｄｉｎｇ：　２０ｐｘ　４０ｐｘ；)

padding: 20px 40px;

(．ｈｅａｄｅｒ－ｌｉｓｔ　ｌｉ　｛｝)

.header-list li {}

(ｆｌｏａｔ：　ｌｅｆｔ；)

float: left;

(ｐａｄｄｉｎｇ：　３３ｐｘ　２０ｐｘ；)

padding: 33px 20px;

(．ｍａｉｎ　｛｝)

.main {}

(ｐａｄｄｉｎｇ：　１００ｐｘ　８０ｐｘ；)

padding: 100px 80px;

(．ｃｏｐｙ－ｃｏｎｔａｉｎｅｒ　ｈ１　｛｝)

.copy-container h1 {}

(ｆｏｎｔ－ｓｉｚｅ：　１４０ｐｘ；)

font-size: 140px;

(．ｃｏｐｙ－ｃｏｎｔａｉｎｅｒ　ｈ２　｛｝)

.copy-container h2 {}

など

(ｆｏｎｔ－ｓｉｚｅ：　６０ｐｘ；)

font-size: 60px;

(．ｃｏｐｙ－ｃｏｎｔａｉｎｅｒ　ｓｐａｎ　｛｝)

.copy-container span {}

(ｃｏｌｏｒ：　＃ｆｆ４ａ４ａ；)

color: #ff4a4a;

(．ｃｏｎｔｅｎｔｓ　｛｝)

.contents {}

(ｈｅｉｇｈｔ：　５００ｐｘ；)

height: 500px;

(ｍａｒｇｉｎ－ｔｏｐ：　１００ｐｘ；)

margin-top: 100px;

(．ｓｅｃｔｉｏｎ－ｔｉｔｌｅ　｛｝)

.section-title {}

(ｂｏｒｄｅｒ－ｂｏｔｔｏｍ：　２ｐｘ　ｓｏｌｉｄ　＃ｄｅｅ７ｅｃ；)

border-bottom: 2px solid #dee7ec;

(ｆｏｎｔ－ｓｉｚｅ：　２８ｐｘ；)

font-size: 28px;

(ｐａｄｄｉｎｇ－ｂｏｔｔｏｍ：　１５ｐｘ；)

padding-bottom: 15px;

(ｍａｒｇｉｎ－ｂｏｔｔｏｍ：　５０ｐｘ；)

margin-bottom: 50px;

(つづきはｃｓｓしょきゅう２（ｐｒｏｇａｔｅへん）へつづく。)

続きはCSS初級2(Progate編)へつづく。

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