CSS 퀴즈: 텍스트 속성

아래 표는 CSS font-family 속성값과 그러한 패밀리가 적용된 헤딩의 스크린 샷입니다. 각 폰트 패밀리를 결과에 대응시켜 보세요:

family	출력값
sans-serif serif cursive monospace

힌트 #11 / 1

올바른 대응은 다음과 같습니다:

family	output	description
sans-serif		"feet"가 없는 부드러운 폰트
serif		"feet"가 있는 폰트
cursive		필기체 서체처럼 보이는 폰트
monospace		모든 문자가 동일한 공간을 차지하는 폰트

텍스트를 굵게 만들기 위해 어떤 CSS 속성을 사용해야 할까요?

정답을 한 개 고르세요:

정답을 한 개 고르세요:

• font-style
• font-weight
• text-decoration
• font-family

힌트 #11 / 1

텍스트를 굵게 하기 위해 bold 값과 함께 CSS font-weight 속성을 이용해야 합니다.

텍스트를 이탤릭체로 만들기 위해 어떤 CSS 속성을 사용해야 할까요?

정답을 한 개 고르세요:

정답을 한 개 고르세요:

• font-style
• font-family
• text-decoration
• font-weight

힌트 #11 / 1

텍스트를 이탤릭체로 하기 위해 italic 값과 함께 CSS font-style 속성을 이용해야 합니다.

다음 중 어떤 것이 CSS에서 font-size 속성에 대해 유효한 단위일까요?

해당되는 답을 모두 고르세요:

해당되는 답을 모두 고르세요:

• lb
• px
• kg
• em

힌트 #11 / 1

CSS font-size에는 다음과 같은 유효한 단위가 많이 있습니다: em, ex, ch, rem, vh, vw, vmin, vmax, px, mm, cm, mm, in, pt, pc. 또한 smaller와 같은 키워드나 %을 이용하여 기술될 수도 있습니다. 가장 인기 있는 것은 px와 em이고 이것들은 이 목록에서 유일하게 유효한 두 개의 선택사항입니다.

자세한 사항은 여기를 읽어보세요: https://developer.mozilla.org/en-US/docs/Web/CSS/length

다음 표는 CSS 속성들과 값의 목록입니다. 값을 다시 정리하여 속성값 쌍이 합리적이도록 만들어 보세요:

속성	값
font-weight text-decoration font-style text-align line-height color	bold underline italic 왼쪽 2em 보라색

힌트 #11 / 1

다음의 속성과 값 쌍만이 합리적입니다:

• font-weight: bold : 텍스트를 굵게 만듭니다.
• text-decoration: underline: 텍스트에 밑줄을 긋습니다.
• font-style: italic: 텍스트를 이탤릭체로 만듭니다.
• text-align: left: 텍스트를 왼쪽으로 정렬합니다.
• line-height: 2em: 줄 사이의 높이를 200%로 증가시킵니다.
• color: purple: 텍스트의 색깔을 보라색으로 변경합니다.