微信小程序字体样式font

微信小程序常用字体样式

一、font-size

微信小程序中的 font-size 是用来设置字体大小的 CSS 属性，单位可以是 px、rpx 或者其它长度单位。其中，px 是在不同设备上显示效果比较一致的单位，rpx 则是根据屏幕宽度进行自适应的单位，具体使用哪种单位需要根据具体需求来决定。例如：

/* 使用 px 作为单位 */
font-size: 30px;

/* 使用 rpx 作为单位 */
font-size: 60rpx;

在设置字体大小时，也可以使用媒体查询来适应不同设备的屏幕大小，例如：

/* 当屏幕宽度小于 480px 时，使用 24px 的字体大小 */
@media screen and (max-width: 480px) {
  font-size: 24px;
}

/* 当屏幕宽度在 480px 到 768px 之间时，使用 30px 的字体大小 */
@media screen and (min-width: 480px) and (max-width: 768px) {
  font-size: 30px;
}

/* 当屏幕宽度大于 768px 时，使用 36px 的字体大小 */
@media screen and (min-width: 768px) {
  font-size: 36px;
}

二、font-weight

微信小程序中可以使用CSS样式设置字体的粗细度，使用font-weight属性，可取值为 normal、bold、bolder、lighter 或数字值。其中，数字值范围为100-900，数值越大表示字体越粗。

例如，设置字体加粗可以使用：

text {
    font-weight: bold;
}

或者

text {
    font-weight: 600; // 数值越大表示字体越粗
}

三、font-style

微信小程序中的 font-style 属性用于设置字体风格。可设置以下值：

• normal：普通字体风格，正常显示。
• italic：斜体字体风格，字体会有倾斜的效果。

示例代码：

<view style="font-style: italic;">Hello, World!</view>

以上代码会将 "Hello, World!" 设置为斜体字体风格。