任务描述
本关任务:在指定标签中添加CSS样式。
效果如下:
css任务效果图
相关知识
为了完成本关任务,你需要掌握:在标签中添加CSS样式属性
在标签中添加CSS样式
在HTML标签中,使用style属性来添加CSS样式,其取值由属性和值组成,两者以冒号“:”分隔,多个属性之间用分号“;”分隔。
示例如下:
内联样式
常用的文本样式属性有:
color:设置文本的颜色
font-family:设置文本的字体
font-size:设置文本的字号大小
text-align:文本水平对齐方式
line-height:设置文本的行间距
编程要求
请在右侧编辑器中的Begin - End区域内补充代码,具体要求是:
1.按照要求的效果在标签中运用CSS样式,编辑唐诗“静夜思”
2.标题文本“静夜思”采用
标签作用,标签中通过style属性为文本添加样式,添加顺序为:
(1)字体设置为楷体;
(2)文本水平居中对齐;
(3)行间距设置为2
3.四句诗的文本采用
标签作用,标签中通过style属性为文本添加样式,添加顺序为:
(1)字体设置为楷体;
(2)文本水平居中对齐。
测试说明
补充代码后,请点击测评,平台会对你编写的代码进行测试,如果正确则完成闯关任务。
越努力越幸运,祝你成功!
代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>初识CSS样式</title>
</head>
<body>
<div style="background-image:url(https://www.educoder.net/api/attachments/1426624);width:360px;height:260px;">
<!-- ********* Begin ********* -->
<h1 style="font-family:楷体;text-align:center;line-height:2;" >静夜思</h1>
<h2 style="font-family:楷体;text-align:center;">床前明月光</h2>
<h2 style="font-family:楷体;text-align:center;">疑是地上霜</h2>
<h2 style="font-family:楷体;text-align:center;">举头望明月</h2>
<h2 style="font-family:楷体;text-align:center;">低头思故乡</h2>
<!-- ********* End ********* -->
</div>
</body>
</html>