字体样式设置.docx

该【字体样式设置 】是由【阿拉丁】上传分享，文档一共【2】页，该文档可以免费在线阅读，需要了解更多关于【字体样式设置 】的内容，可以使用淘豆网的站内搜索功能，选择自己适合的文档，以下文字是截取该文章内的部分文字，如需要获得完整电子版，请下载此文档到您的设备，方便您编辑和打印。课时内容
字体样式设置
课时
1
教学目标
掌握分别利用style和class属性设置字体样式,包括设置文本的颜色,字符间距,文本对齐,文本装饰,文本缩进
教学重点
style和class属性设置字体样式
教学难点
style和class属性设置字体样式
教学设计
:通过实训任务来让学生掌握style和class属性设置字体样式,包括设置文本的颜色,字符间距,文本对齐,文本装饰,文本缩进等
:多媒体+计算机
:教材、多媒体课件
教学内容
一、任务描述
设计一个小程序,分别利用style和class属性设置字体样式,包括设置文本的颜色,字符间距,文本对齐,文本装饰,文本缩进等等。
二、导入知识点
本任务主要介绍了各种字体样式属性的名称及其含义,利用style和class设置字体样式的方法,。
字体属性包括字体类型、大小、粗细、风格(如斜体)和变形(如小型大写字母)等。。

属性
含义
属性值举例
font-family
字体类型
serif,sans-serif,monospace,cursive,fantasy,…
font-size
字体大小
5px/rpx/cm,large,small,medium,larger,smaller,
…
font-style
字体倾斜
italic,normal,oblique,
…
font-weight
字体粗细
bold,bolder,lighter,
…
view组件支持使用style、class属性来设置组件的样式,静态的样式一般写到class中,动态的样式一般写到style中,这样可以提高渲染速度。,,可以在项目中的任何页面使用,。
三、实现效果
。,。标题下面、,设置的字体样式为:Courier、蓝色、30像素。,,设置的字体样式为:Impact、25像素、绿色、倾斜、加粗。

四、任务实现

代码中主要使用了view组件科、加粗的style和class属性来设置字体样式,其中style是直接在标签内部进行设置,而class则首先需要在wxss文件中定义样式类,然后在wxml文件中通过class属性引用。.,,是全局样式,可以在项目中的任何WXML文件中使用。fontStyle样式类用来设置字体样式,,一般只能在index页面文件中使用。

。

,。
练习