主页 > 其他院校 > 国家开放大学 >

国家开放大学生命健康学院Dreamweaver网页设计形考任务二【标准答案】

作者:pyfdzj

形考任务二 活动1:采用CSS样式来设置背景、标题和段落的颜色。 HTML代码如下: html head /head body 这是标题 1 这是标题 2 这是段落 这个段落设置了内边距。 /body /html 活动2:使用百分比
形考任务二
活动1:采用CSS样式来设置背景、标题和段落的颜色。
 
HTML代码如下:
 
<html>
 
<head>
 
</head>
 
<body>
 
这是标题 1
这是标题 2
这是段落
 
这个段落设置了内边距。
 
</body>
 
</html>
 
活动2:使用百分比或者像素值设置行间距。
 
HTML代码如下:
 
<html>
 
<head>
 
</head>
 
<body>
 
这是拥有标准行高的段落。
 
在大多数浏览器中默认行高大约是 110% 到 120%。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
</body>
 
</html>
 
参考答案
 
<html>
 
<head>
 
<style type="text/css">
 
body {background-color: yellow}
 
h1 {background-color: #00ff00}
 
h2 {background-color: transparent}
 
p {background-color: rgb(250,0,255)}
 
p.no2 {background-color: gray; padding: 20px;}
 
</style>
 
</head>
 
<body>
 
这是标题 1
这是标题 2
这是段落
 
这个段落设置了内边距。
 
</body>
 
</html>
 
(1)百分比
 
<html>
 
<head>
 
<style type="text/css">
 
p.small {line-height: 90%}
 
p.big {line-height: 200%}
 
</style>
 
</head>
 
<body>
 
这是拥有标准行高的段落。
 
在大多数浏览器中默认行高大约是 110% 到 120%。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
</body>
 
</html>
 
(2)像素值
 
<html>
 
<head>
 
<style type="text/css">
 
p.small{ line-height: 10px }
 
p.big{ line-height: 30px }
 
</style>
 
</head>
 
<body>
 
这是拥有标准行高的段落。
 
在大多数浏览器中默认行高大约是 20px。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这是拥有标准行高的段落。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更小的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
这个段落拥有更大的行高。
 
</body>
 
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章