微信小程序开发与应用——字体样式设置

news2024/9/22 15:43:39

要求:设置字体样式。

1、打开微信开发者工具,创建一个小程序,如下:
在这里插入图片描述
2、设置小程序的项目名称和路径,并选择开发语言为JavaScript,如下:
在这里插入图片描述
3、小程序的主体部分由三个文件组成,且都要放在项目的根目录,即app.js(描述小程序的逻辑)app.json(描述小程序的公共配置)app.wxss(描述小程序的公共样式表),这里最后一个文件样式表不是必须的,可以在资源管理器中找到这些文件,如下:
在这里插入图片描述
小程序的页面部分由四个文件类型组成的,它们在pages目录下,分别为.js(负责页面逻辑).json(负责页面结构).wxml(负责页面配置).wxss(负责页面样式表),其中.json和.wxss文件类型不是必需的,也是可以在资源管理器中找到,如下:
在这里插入图片描述
4、在页面配置下的wxml文件类型下,通过style标签或class标签来设置字体样式,它设置定义的样式类只能在index。

WXML(WeiXin Markup Language)是框架设计的一套标签语言开发中 WXML 页面就作为我们一些逻辑行为的入口,以及效果展示的承载者,可以把它理解为HTML语言。

通过style属性来设置字体样式:
style='font-family:' (设置字体类型),其取值是字体的名称。
style='font-size:'(字体大小),其取值通过px、rpx、cm来表示字体的大小,也可以通过small、medium、large等来表示。
style='font-style:'(字体倾斜),其取值通过italic、normal等来表示。
style='font-weight:'(字体粗细),其取值通过bold、bolder、lighter等来表示。
例如,下列wxml代码,设置字体类型为楷体,字体大小为20像素,字体倾斜且加粗:

<!--index.wxml-->
<view style="font-family:楷体;font-size:20px;font-style:italic;font-weight:bold">
  WXML(WeiXin Markup Language)是框架设计的一套标签语言开发中 WXML 页面就作为我们一些逻辑行为的入口,以及效果展示的承载者,可以把它理解为HTML语言。
</view>

模拟器运行如下:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/732878.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2023.07.08力扣6题

167. 两数之和 II - 输入有序数组 给你一个下标从 1 开始的整数数组 numbers &#xff0c;该数组已按 非递减顺序排列 &#xff0c;请你从数组中找出满足相加之和等于目标数 target 的两个数。如果设这两个数分别是 numbers[index1] 和 numbers[index2] &#xff0c;则 1 < …

Carla与Ros联合仿真教学与踩坑经历

Carla与Ros联合仿真教学与踩坑经历 前言 本人需要用到carla进行仿真&#xff0c;做实验&#xff0c;研究了这个平台几个月。 需要注意的是&#xff0c;本人没有保留所有的ros包&#xff0c;而是选择一些进行使用&#xff0c;其他大家可以进行扩展。 carla0.9.5版本和carla0.…

雅思口语考试的顺序与技巧?

雅思口语的考试顺序&#xff0c;也是学生们在开始考试前要了解的信息。雅思的口语考试到底有怎样的考试顺序&#xff1f;下面就听小编讲讲它的考试顺序&#xff0c;以及考试中的技巧。 一、雅思口试考试顺序 众所周知&#xff0c;雅思考试分为笔试和口试。正常情况下&#xff…

YOLOV5-Lite轻量化部署与训练

文章目录 前言项目下载项目运行自定义数据集训练使用LabelImg标注制作数据集划分训练文件生成标签聚合操作辅助脚本需要运行的脚本 开始训练 总结 前言 没啥意思&#xff0c;很简单&#xff0c;需要实现一个目标检测&#xff0c;但是&#xff0c;不能占用太多运算资源&#xf…

【双指针】977. 有序数组的平方

977. 有序数组的平方 解题思路 思路: 设置前后指针最大的元素一定是存在再前后位置,然后因为负数平方之后可能大于整数的平方每次比较前后指针指向的元素的平方 然后存下较大的元素平方 然后移动指针 class Solution {public int[] sortedSquares(int[] nums) {// 设置前后指…

Git--远程操作

文章目录 前言一、理解分布式版本控制系统二、远程仓库1.新建远程仓库2.克隆远程仓库3.向远程仓库推送4.拉取远程仓库5.配置Git忽略特殊文件 给命令配置别名 总结 前言 正文开始!!! 一、理解分布式版本控制系统 我们目前所说的所有内容(工作区,暂存区,版本库等等),都是在本地…

scratch角色跟随

scratch 角色跟随 本程序实现了角色跟随功能&#xff0c;第一个角色面向鼠标指针&#xff0c;其它角色面向前一个角色&#xff0c;在距离较小时暂停。 5个角色的程序依次为&#xff1a;

RegNeRF,FreeNeRF: 神经辐射场的自由频率正则化,几何正则化,外观正则化,遮挡正则化

目录 概要&#xff1a; 一 论文 RegNeRF: Regularizing Neural Radiance Fields for View Synthesis from Sparse Inputs 1.几何正则化 2.外观正则化 二 论文 FreeNeRF: Improving Few-shot Neural Rendering with Free Frequency Regularization 3 频率正则化 和自由频…

155 mini_stack

Title Description 155. 最小栈 - 力扣&#xff08;Leetcode&#xff09; resolvent 觉得比较困难的地方就是在minstack那个部分: 两个创新点: 1.使用了INTMAX防止存放有效避免指针的问题 2.使用了min_stack时间换空间 class MinStack { public:stack<int> stack1;s…

ChatGPT带我做四轴飞行器和自平衡小车

按照ChatGPT的说法&#xff0c;这款主板的的主控MCU、无线通信、电源管理、外设接口可以共用&#xff0c;需要差异化的有电机驱动、传感器的选择、控制算法和软件、电源供电。ChatGPT说的共用部分没啥争议&#xff0c;有差异化的地方需要细想下&#xff1a;电机驱动显然应该不同…

three.jsgsap滚动交互网页实现 2-创建文字并添加离开动画

添加动画 让聚光灯的角度随着下滑增大&#xff0c;展示完整的场景 const container document.querySelector("#container");gsap.to(light, {angle: 0.7,scrollTrigger: {trigger: container,start: 0,end: innerHeight,scrub: 1},});这样下滑一个屏幕高度聚光灯的角…

Redis——初窥门径

前言 在这篇文章中&#xff0c;荔枝整理了初步了解Redis的一些基础知识和常见指令。通过这篇文章我们可以弄懂Redis具体是什么以及主要的功能、基本数据类型和操作指令。这里注意如果标题后面带*则是仅需要了解就行的知识点哈。 文章目录 前言 一、Redis概述和配置 1.1 概述…

Android Compose UI实战练手----Google Bloom 主页实现(完结)

目录 1.概述2.页面展示2.1 亮色主题2.2 深色主题 3.页面拆分及实现3.1 主页的UI整体UI架构实现3.2 底部导航栏BottomBar的实现3.3 搜索栏SearchBar的实现3.4 Banner实现3.5 中间信息列表BloomInfoList的实现 4.源码地址 1.概述 主页的页面比前面的欢迎页和登录页面要复杂得多&…

Microsoft Visual Studio 2022添加.NET Framework 4.6.2框架,然后说下.NET目标包的作用。

众所周知&#xff0c;Microsoft Visual Studio 2022不再支持.NET Framework 4.6以下的框架。从而导致前期使用老框架开发的某些应用无法打开&#xff08;打开时提示安装框架&#xff0c;但又安装不成功&#xff09;的情况出现。 前于如何安装.NET Framework 4.5及更早版本框架的…

Java中的字符串类

提示&#xff1a;字符串类是编程中最常用的一种数据类型&#xff0c;比较重要❗ 文章目录 前言一、字符串类创建对象方式静态创建动态创建 二、String字符串内容不可改变三、字符串常用方法length方法charAt方法substring方法indexOf与lastIndexOfindexOf方法lastIndexOf方法 替…

计算机基础--->数据结构(9)【并查集】

文章目录 并查集的概述并查集的主要用途并查集的实现创建和初始化集合查找当前元素的集合根节点判断两个元素是否处于同一集合合并两个集合对节点的路径进行压缩 并查集的概述 并查集是一种用于解决集合合并和查询问题的数据结构&#xff0c;主要用于实现有关集合的操作&#x…

Skywalking高级使用

Skywalking高级使用 RPC调用监控Mysql调用监控Skywalking常用插件获取追踪ID过滤指定的端点告警功能Skywalking原理Open Tracing介绍 RPC调用监控 Skywalking(6.5.0)支持的RPC框架有以下几种&#xff1a; (1) Dubbo 2.5.4 -> 2.6.0 (2) Dubbox 2.8.4 (3) Apache Dubbo 2.7.…

动态规划 DP (六) 字符串编辑

1.字符串编辑 字符串编辑问题是一类常见的问题&#xff0c;通常涉及对字符串进行插入、删除、替换等操作&#xff0c;以达到某种特定的目标。 常见的字符串编辑问题包括&#xff1a; 编辑距离&#xff08;Edit Distance&#xff09;&#xff1a;给定两个字符串&#xff0c;通…

最新抖音娱乐测评小程序源码 Thinkphp后端 抖音引流小程序

最新抖音娱乐测评小程序源码 thinkphp后端 抖音引流小程序 附搭建教程 测试环境 NginxPHP7.0MySQL5.6 网站运行目录设置为 /web 数据库配置文件 \source\application\database.php 后台登录地址 http://你的域名/index.php?s/admin/passport/login

python环境

卸载旧环境 wini 打开应用卸载 删除python解释器和pycharm 删除配置文件夹JetBrains C:\Users\CJC\AppData\Roaming\JetBrains 安装 安装python解释器 安装pycharm 查看或设置该项目的解释器和安装包 快捷键 全局搜索 双击shift 当前文件中搜索 ctrl f 查看函数…