前端

HarmonyOS ArkWeb 系列之网页里的复制粘贴,没你想的那么简单

文章目录 先搞清楚:Web 里有几种剪贴板操作? Async Clipboard API 是什么 ArkTS 侧怎么接入 H5 侧的完整实现 整体流程图 权限问题说清楚 踩坑记录 写在最后 说实话,刚开始做 Web 嵌入的时候,我以为剪贴板功能是最简单的那一类——不就是 Ctrl+C、Ctrl+V

颠覆原型设计!Figma Make 实测:AI 真的能帮你写完前端吗?

一、什么是 Figma Make?Figma Make 是 Figma 于 2025 年在 Config 大会上推出的 AI 驱动的 “Prompt‑to‑App” 工具,可将自然语言描述或现有 Figma 设计稿转换为可交互原型、网页或 Web App,而且支持通过聊天式界面进行迭代修改 (Figma, Figma学习中心)。 它基于 Anthropic

关于 Safari 100vh 的问题与解决方案

配图源自 Freepik 一、背景 最近在做一个移动端的 H5 项目,遇到了一个「有趣」的问题。假设有一页面布局如下: 下方 50px 悬浮于底部,采用 fixed 布局,示例如下: <div class="container"> <!-- height: 100vh - 50px --> <div class="page">&

【前端小站】CSS 样式美学:从基础语法到界面精筑的实战宝典

半桔:个人主页  🔥 个人专栏: 《前端扫盲》《手撕面试算法》《C++从入门到入土》 🔖阻止了我的脚步的,并不是我所看见的东西,而是我所无法看见的那些东西。 ​《海上钢琴师》 文章目录 前言 一. CSS是什么 1.1 概念 1.2 基本语法 二. CSS如何引入H

CSS基础-08-Display(隐藏元素 display:none,内联元素转块元素 display:inline,块元素 → 内联元素 display:block)

1. 隐藏元素 (display:none) 1.1 Display 作用: 隐藏某个元素,且该元素不占用空间。 示例 {display:none;} 1.2 和 Visibility比较 作用 隐藏某个元素,但该元素仍占用之前空间。 语法 visibility:hidden 2. 内联元素→ 块元素 (display:inline) 内联元素(行内元素) 语法 dis

HarmonyOS ArkWeb 系列之画中画功能实现:网页视频悬浮播放全指南

文章目录 画中画的工作方式 ArkTS 侧:极简配置 HTML 侧:画中画逻辑 视频来源的处理方式 进阶:用 JS 监听画中画窗口尺寸 画中画 vs 系统 PiP 常见问题 写在最后 画中画(Picture-in-Picture)就是把视频变成一个小悬浮窗,可以在桌面上到处拖,

前端字符串缩写工具-abbreviate库使用指南

本文还有配套的精品资源,点击获取 简介:"abbreviate"是一个前端开源库,用于将长字符串缩写,便于在有限空间内显示更多信息。它遵循特定的调用约定,如 "r:abbreviate",并可能提供自定义长度、保留核心信息、智能处理、支持多种格式和可扩展性等特性。开发者可以

WebSocket 超细致完整用法讲解(含原理 + 前端 + 后端 + 实战案例 + 避坑)

你想要透彻掌握 WebSocket 的完整用法,我会从核心原理、前后端完整代码、使用场景、核心 API、心跳保活、常见问题等维度,一步步细致讲解,内容通俗易懂,学完就能直接落地开发。一、WebSocket 核心认知(必懂,理解了用法才通透)1. WebSocket 是什么?WebSock