Web制作課題Q14

課題

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>復習（2）文字と背景Q14</title>
<a link href="style.css">
</head>
<body>
<p class="sample1">アクセシビリティに配慮した文字を指定したい[100%]</p>
<p class="sample2">アクセシビリティに配慮した文字を指定したい[1em]</p>
<p class="sample3">アクセシビリティに配慮した文字を指定したい[16px]</p>
<p class="sample4">アクセシビリティに配慮した文字を指定したい[medium]</p>
<hr>
<p class="sample5">アクセシビリティに配慮した文字を指定したい[200%]</p>
<p class="sample6">アクセシビリティに配慮した文字を指定したい[2em]</p>
<p class="sample7">アクセシビリティに配慮した文字を指定したい[32px]</p>
<p class="sample8">アクセシビリティに配慮した文字を指定したい[xx-large]</p>
</body>
</html>

CSS

p.sample1 {
  font-size: 100%;
}
p.sample2{
  font-size: 1em;
}
p.sample3 {
  font-size: 16px;
}
p.sample4 {
  font-size: medium;
}
p.sample5 {
  font-size: 200%;
}
p.sample6 {
  font-size: 2em;
}
p.sample7 {
  font-size: 32px;
}
p.sample8 {
  font-size: xx-large;
}