2.8 KiB
2.8 KiB
id, title, challengeType, videoUrl, forumTopicId, dashedName
id | title | challengeType | videoUrl | forumTopicId | dashedName |
---|---|---|---|---|---|
587d781c367417b2b2512ac2 | 設置多個標題元素的 font-size | 0 | https://scrimba.com/c/cPpQNT3 | 301067 | set-the-font-size-for-multiple-heading-elements |
--description--
font-size
屬性用來指定元素內文字的大小。 我們可以爲多個元素添加這個規則,讓頁面內不同元素的文字大小得以統一。 在本挑戰裏,你需要設置從 h1
到 h6
的文字大小。
--instructions--
在 style
標籤中, 對各元素的 font-size
進行如下設置:
- 將
h1
標籤的文字大小設爲 68px。 - 將
h2
標籤的文字大小設爲 52px。 - 將
h3
標籤的文字大小設爲 40px - 將
h4
標籤的文字大小設爲 32px - 將
h5
標籤的文字大小設爲 21px - 將
h6
標籤的文字大小設爲 14px
--hints--
h1
標籤的 font-size
屬性值應爲 68px。
const fontSizeOfh1 = new __helpers.CSSHelp(document).getStyle('h1')?.getPropertyValue('font-size');
assert(fontSizeOfh1 === '68px');
h2
標籤的 font-size
屬性值應爲 52px。
const fontSizeOfh2 = new __helpers.CSSHelp(document).getStyle('h2')?.getPropertyValue('font-size');
assert(fontSizeOfh2 === '52px');
h3
標籤的 font-size
屬性值應爲 40px。
const fontSizeOfh3 = new __helpers.CSSHelp(document).getStyle('h3')?.getPropertyValue('font-size');
assert(fontSizeOfh3 === '40px');
h4
標籤的 font-size
屬性值應爲 32px。
const fontSizeOfh4 = new __helpers.CSSHelp(document).getStyle('h4')?.getPropertyValue('font-size');
assert(fontSizeOfh4 === '32px');
h5
標籤的 font-size
屬性值應爲 21px。
const fontSizeOfh5 = new __helpers.CSSHelp(document).getStyle('h5')?.getPropertyValue('font-size');
assert(fontSizeOfh5 === '21px');
h6
標籤的 font-size
屬性值應爲 14px。
const fontSizeOfh6 = new __helpers.CSSHelp(document).getStyle('h6')?.getPropertyValue('font-size');
assert(fontSizeOfh6 === '14px');
--seed--
--seed-contents--
<style>
</style>
<h1>This is h1 text</h1>
<h2>This is h2 text</h2>
<h3>This is h3 text</h3>
<h4>This is h4 text</h4>
<h5>This is h5 text</h5>
<h6>This is h6 text</h6>
--solutions--
<style>
h1 {
font-size: 68px;
}
h2 {
font-size: 52px;
}
h3 {
font-size: 40px;
}
h4 {
font-size: 32px;
}
h5 {
font-size: 21px;
}
h6 {
font-size: 14px;
}
</style>
<h1>This is h1 text</h1>
<h2>This is h2 text</h2>
<h3>This is h3 text</h3>
<h4>This is h4 text</h4>
<h5>This is h5 text</h5>
<h6>This is h6 text</h6>