CSS教程

educoder太原理工web程序设计——CSS3-文本字体样式

本文主要是介绍educoder太原理工web程序设计——CSS3-文本字体样式,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

第1关:字体样式属性相关的概念

  • 1、下列选项中,用于设置文本字体的属性名是( B

    A、

    font-style

    B、

    font-family

    C、

    font-weight

    D、

    font-size

  • 2、下列选项中,用于定义服务器字体的是( D

    A、

    font-family

    B、

    @font-family

    C、

    font-face

    D、

    @font-face

  • 3、对段落p中的文本字体、字号及字体风格样式进行综合设置,其样式代码可写为: p{font:隶书 20px italic;}   A

    A、

    错误

    B、

    正确

 

第2关:美食专栏网页的结构设置

任务描述

本关任务:设置一个美食专栏网页的主体结构。

<!doctype html>
<html><head>
<meta charset="utf-8">
<title>美食专题栏目</title>
</head>
<body>
<img src="https://www.educoder.net/api/attachments/1989171 "插图"" alt="跳槽有道" />
<!-- ********* Begin ********* -->
<p>
	<em class="blue">导语</em>:臭豆腐是<strong class="red">长沙</strong>有名的小吃,是一种独具风味的食品。“闻起来臭、吃起来香”是它的最大特点,不少外省人品尝后都赞不绝口。长沙的臭豆腐要数百年老店火宫殿炸得最好,外焦微脆、内软味鲜,100多年来,进火宫殿的人没有不吃臭豆腐的。当年...<em>【详情】</em>
</p>
<p>
	<em class="blue">火宫殿臭豆腐</em>:价格<strong class="money">18</strong>元
</p>
<!-- ********* End ********* -->
</body>
</html>

 

第3关:美食专栏网页的样式设置

任务描述

本关任务:设置美食专栏网页的文字样式。

 <!doctype html>
<html><head>
<meta charset="utf-8">
<title>美食专题栏目</title>
<!-- ********* Begin ********* -->
<style type="text/css">
p{font-size:16px;font-family:微软雅黑;}
.blue{color:#33F;}
.red{color:#F00;}
.money{font-size:16px;}



</style>
<!-- ********* End ********* -->
</head>
<body>
<img src="https://www.educoder.net/api/attachments/1989171 "插图"" alt="跳槽有道" />
<p>
	<em class="blue">导语</em>:臭豆腐是<strong class="red">长沙</strong>有名的小吃,是一种独具风味的食品。“闻起来臭、吃起来香”是它的最大特点,不少外省人品尝后都赞不绝口。长沙的臭豆腐要数百年老店火宫殿炸得最好,外焦微脆、内软味鲜,100多年来,进火宫殿的人没有不吃臭豆腐的。当年...<em>【详情】</em>
</p>
<p>
	<em class="blue">火宫殿臭豆腐</em>:价格<strong class="money">18</strong>元
</p>
</body>
</html> 

这篇关于educoder太原理工web程序设计——CSS3-文本字体样式的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!