--- id: 62015a5da1c95c358f079ebb title: 步驟 37 challengeType: 0 dashedName: step-37 --- # --description-- `:first-of-type` 僞選擇器用於定位與選擇器匹配的第一個元素。 創建一個 `h1 .flex span:first-of-type` 選擇器,以定位 `.flex` 容器中的第一個 `span` 元素。 請記住,`span` 元素在視覺上是顛倒的,因此這看起來是頁面上的第二個元素。 給你的新選擇器一個 `0.7em` 的 `font-size` 屬性,使它看起來像一個子標題。 # --hints-- 應該有一個 `h1 .flex span:first-of-type` 選擇器。 ```js assert(new __helpers.CSSHelp(document).getStyle('h1 .flex span:first-of-type')); ``` `h1 .flex span:first-of-type` 選擇器應該有一個 `font-size` 屬性設置爲 `0.7em`。 ```js assert(new __helpers.CSSHelp(document).getStyle('h1 .flex span:first-of-type')?.getPropertyValue('font-size') === '0.7em'); ``` # --seed-- ## --seed-contents-- ```html Balance Sheet

AcmeWidgetCorp Balance Sheet

Assets
2019 2020 2021
Cash This is the cash we currently have on hand. $25 $30 $28
Checking Our primary transactional account. $54 $56 $53
Savings Funds set aside for emergencies. $500 $650 $728
Total Assets $579 $736 $809
Liabilities
2019 2020 2021
Loans The outstanding balance on our startup loan. $500 $250 $0
Expenses Annual anticipated expenses, such as payroll. $200 $300 $400
Credit The outstanding balance on our credit card. $50 $50 $75
Total Liabilities $750 $600 $475
Net Worth
2019 2020 2021
Total Net Worth $-171 $136 $334
``` ```css span[class~="sr-only"] { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); -webkit-clip-path: inset(50%); height: 1px; width: 1px; position: absolute; overflow: hidden; white-space: nowrap; padding: 0; margin: -1px; } html { box-sizing: border-box; } body { font-family: sans-serif; color: #0a0a23; } h1 { max-width: 37.25rem; margin: 0 auto; padding: 1.5rem 1.25rem; } h1 .flex { display: flex; flex-direction: column-reverse; gap: 1rem; } --fcc-editable-region-- --fcc-editable-region-- ```