1、使用标签style属性设置标签内文字的样式

说明：这种文字样式设计只需要在标签当中设计就好了，style 接收动态的样式，在运行时会进行解析，请尽量避免将静态的样式写进 style 中，以免影响渲染速度。
WXML：

<view style="font-family:楷书;font-size:30px;">
  <view>利用style设置字体样式</view>
  <view>字体：sans-serif,30像素</view>
</view>

2、使用class属性关联wxss设置标签内文字样式

说明：使用这种方式需要在WXML中关联class，用于指定样式规则，其属性值是样式规则中类选择器名(样式类名)的集合，样式类名不需要带上.，样式类名之间用空格分隔。
WXML:

<view class="fontStyle">
    <view>利用class设置字体样式</view>
    <view>字体：Cursive、25像素、倾斜、加粗</view>
</view>

WXSS:

.fontStyle{
    font-family:cursive;
    font-size: 25px;
    font-style: italic;
    font-weight: bold;
} 

3、添加文本“外框”

WXSS:

.box{
  border: 1px solid silver;
  margin: 20rpx;
  padding: 20rpx;
}

4、添加标题样式

WXSS:

.title{
  font-size: 25px;
  text-align: center;
  margin-bottom: 15px;
  color: red;
}

5、补充：

接下来在wxml中补充一点代码就可以实现下面的展示效果了：

最终模拟器展示效果.jpg

6、总结：

6.1、用到的属性总结：

font-family:（字体）

• Serif（）
• Monospace（等宽字体）
• Cursive（草书）
• Fantasy（）
  ~
  font-size:（字体尺寸）
• 5px/rpx/cm，large，small，medium，larger，smaller，~
  font-style:（字体样式）
• italic（斜体）
• normal（）
• oblique（）
  ~
  font-weight:（字体灰度）
• bold（黑体）
• bolder（加黑体）
• lighter（淡色的）
  ~
  border（边框）
• 1px（外框粗细）
• solid （实线）
• silver（外框颜色：silver是银色）
  margin（边框外边距）
  padding（边框内边距）

6.2、view组件使用style、class属性来设置组件样式的区别：

• 利用style可直接在wxml文件中设置，利用class需要在wxss文件中定义样式类
• 静态样式一般使用class设置，动态样式一般使用style设置，这样可以提高渲染速度。

6.3、关于app.wxss中定义样式与index.wxss中定义样式类的区别：

• app.wxss中定义的样式类可以在任何文件的wxml中使用，在index.wxss中定义的样式类只能在index.wxml中使用