Web移动适配
移动适配视口作用：显示 HTML 网页的区域，用来约束 HTML 的尺寸
123456789101112131415<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!– 视口标签 --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> </body></html>
width=device-width：视口宽度 = 设备宽度
initial-s ...
CSS用法（二）
平面转换简介作用：为元素添加动态效果，一般与过渡配合使用概念：改变盒子在平面内的形态（位移、旋转、缩放、倾斜）
平移1transform: translate(X轴移动距离, Y轴移动距离);
取值
像素单位数值
百分比（参照盒子自身尺寸计算结果）
正负均可
技巧
translate() 只写一个值，表示沿着 X 轴移动
单独设置 X 或 Y 轴移动距离：translateX() 或 translateY()
平移实现定位居中：
方法一：margin
1234567position: absolute;left: 50%;top: 50%;margin-left: -100px;margin-top: -50px;width: 200px;height: 100px;
方法二：平移 → 百分比参照盒子自身尺寸计算结果
1234position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);
双开门案例：
12345<!--HTML--><div class=&quo ...
CSS用法
CSS引入方式
内部样式表：将CSS代码写在style标签当中
外部样式表：单独出CSS文件，通过link标签引入
1<link rel="stylesheet" href="./my.css">
行内样式：CSS写在标签的style属性值当中
1<div style="color: red; font-size: 20px;">这是行内样式<div>
CSS选择器基础选择器
标签选择器：使用标签名作为选择器，同名标签设置相同的样式
类选择器：定义类名，标签添加.类名，差异化设置标签显示效果
123456<style> .banner{ }</style><div class="banner">类选择器</div>
id选择器：与类类似，定义#id名，一般配合JavaScript使用，同一个id选择器在一个页面只能使用一次
通配符选择器：所有标签设置相同样式，*不需要调用
复合选择器有多 ...
HTML用法
标题标签<h1></h1>
h1~h6（双标签）
h1 标签一个网页只能用一次，用来放标题或者logo
h2~h6 没有使用限制
段落标签<p></p>
独占一行
段落没有间隙
换行和水平线标签有时候段落需要换行可以使用
换行：<br>
水平线：<hr>
文本格式化标签为文本添加特殊格式，以突出重点，均为双标签
标签名
效果
strong / b
加粗
em / i
倾斜
ins / u
下划线
del / s
删除线
媒体标签图像标签<img src="图片地址">
属性
作用
说明
alt
替换文本
图片无法显示的时候显示的文字
title
提示文本
鼠标悬停显示的文字
width
图片宽度
height
图片高度
音频标签<audio src="音频地址"></audio>
属性
作用
特殊说明
src
音频U ...
鸿蒙HarmonyOS 4-通知
基础通知应用可以通过通知接口发送通知消息，提醒用户关注应用中的变化。用户可以在通知栏查看和操作通知内容。
导入notification模块
1import notificationManager from '@ohos.notificationManager'
发送通知
1234567891011// 2.1 构建通知请求let request: notificationManager.NotificationRequest = { id: 10, content: { //通知内容 }}// 2.2 发布通知notificationManager.publish(request) .then(() => console.log('发送成功')) .catch(reason => console.log('发送失败'， JSON.stringify(reason)))
取消通知
1234//取消指定id的通知notificationManager.cance ...
鸿蒙HarmonyOS 4-数据持久化
用户首选项
用户首选项（Preference）为应用提供Key-Value键值型的数据处理能力，支持应用持久化轻量级数据。
轻量化数据指的是结构简单，能够用Key-Value表示，同时占用内存小的数据
导入首选项模块1import dataPreference from '@ohos.data.preferences'
获取首选项实例，读取指定文件1234567datePreference.getPreferences(this.context, 'MyAppPreferences')//UIAbility和Preferences实例名称 .then(preferences => { //获取成功 }) .catch(reason => { //获取失败 })
数据操作123456789101112// 3.1 写入数据，如果已经存在则覆盖，可利用.has()判断是否存在Preferences.put('key', val) .then(() => prefe ...
鸿蒙HarmonyOS 4-网络连接
http请求数据
导入http模块1import http from '@ohos.net.http'
是用http模块发生请求，处理响应12345678910111213141516171819// 2.1 创建一个http的请求对象，不可复用let httpRequest = http.createHttp()// 2.2 发生网络请求httpRequest.request( 'http://localhost:3000/users', //请求URL路径 { //请求选项HttpRequestOptions method: http.RequestMethod.GET, extraData: {'param1': 'value1'} //k1=v1&k2=v2 }) //Promise：存放未来会完成的结果// 2.3 处理响应结果.then((resp: http.HttpRequest) => { if(resp.resp ...
鸿蒙HarmonyOS 4-Stage模型
Stage模型概述
详细内容可以看一下鸿蒙开发者文档
模块是应用的基本功能单元，包含源代码、资源以及配置文件等内容
模块分为两大类，像entry这样的模块称为Ability Module能力模块，而通用的资源等可以放在一个模块当中，这样的模块成为Library Module，Ability Module就可以去引用Library的模块了。
整个源码会被编译打包成APP，为了降低不同功能模块之间的耦合，每一个模块都是可以独立编译和运行的，所有的Ability Module会被编译成HAP文件，而Library Module会被编译成HSP文件。
一个应用有且只有一个Entry类型的HAP文件，而Feature类型可以有多个。
所有HAP文件最后会打包成Bundle文件，最后一起打包成安装包文件。Bundle name是整个应用的唯一标识。
HAP在运行时会创建一个名为Ability Stage的实例，理解为应用组件的“舞台”。
因为Ability和窗口的分割，可以实现对不同设备窗口的单独裁切适配。
应用配置文件
鸿蒙应用的配置文件有两类：
第一类值针对这个应用的全局配置文件，在AppS ...
鸿蒙HarmonyOS 4-动画
属性动画
属性动画是通过设置组件的animation属性来给组件添加动画，当组件的width、height、Opacity、backgroundColor、scale、rotate、translate等属性变更时，可以实现渐变过度效果。
名称
参数类型
必填
描述
duration
number
否
设置动画时长默认值：1000，单位：毫秒
tempo
number
否
动画播放速度。数值越大，速度越快。默认值：1
curve
string | Curve
否
设置动画曲线。默认值：Curve.EaselnOut，平滑开始和结束
delay
number
否
设置动画延迟执行的时长默认值：0，单位:毫秒
iterations
number
否
设置播放次数。默认值：1，取值范围：[-1,+o)说明：设置为-1时表示无限次播放。
playMode
PlayMode
否
设置动画播放模式，默认播放完成后重头开始播放默认值：PlavMode.Normal
onFinish
()=> void
否
状态回调，动画播放完成时触发。
123 ...
鸿蒙HarmonyOS 4-页面路由
页面路由router
页面路由router是指在应用程序中实现不同页面之间的跳转和数据传递
页面保留在页面栈，先进后出，所以最先打开的在最前面
页面栈的最大容量上限是32个页面，使用router.clear()方法可以清空页面栈，释放内存
Router有两种页面跳转模式，分别是：
router.pushUrl()：目标页不会替换当前页，而是压入页面栈，因此可以用router.back()返回当前页
router.replaceUrl()：目标页替换当前页，当前页会被销毁并释放资源，无法返回当前页
Router有两种页面实例模式，分别是：
Standard：标准实例模式，每次跳转都会建立一个目标页并压入栈顶。默认就是这个模式
single：单实例模式，如果目标页已经存在，则将离栈顶最近的同Url页面移至栈顶并重新加载
用法
首先要导入HarmonyOS提供的Router模块：1import router from '@ohos.router';
然后利用router实现跳转、返回等操作：1234567891011121314151617181920212 ...