纯HTML + CSS + JS 实现Popup弹窗
在 Web 开发中，弹窗（Popup）是一种极其常见的交互组件，广泛用于： 表单提交确认 删除操作二次确认 登录/注册入口 信息提示或警告 虽然现在有大量 UI 框架（如 Element UI、Ant Design、Bootstrap）提供现成的弹窗组件，但理解其底层实现原理，不仅能让你在无框架环境 ...
记录---让网页像现实世界一样“拿起来，放进去”
写在开头 点赞 + 收藏 学会 引言 2025年，我们早已习惯用手指滑动屏幕、拖动文件。而这一切流畅体验的背后，HTML5 的 拖拽（Drag and Drop） 功能功不可没。它让网页不再只是“点一点”，而是可以“拖一拖、放一放”，大大提升了交互的直观性和用户体验。 为什么 ...
如何进行页面前端监控
写在开头 点赞 + 收藏 学会 前端监控主要分三个方向 前端性能（用户体验优化） 异常监控 业务指标跟 下面我来分别介绍三类指标如何获取 1）前端性能指标： 一、用户体验相关的： 页面加载时间（Page Load Time） ： 定义：从用户请求页面到页面完全加载的时间。 测 ...
B站首页的 Banner 这么好看，我让你直接用到你的项目！
写在开头 点赞 + 收藏 学会 写在前面 我最开始是用 Angular 去实现了B站的 Banner ，那时候还没有人做这东西，可以看到下面那一长串 Bannet 图片的第一个图是好几年以前的了。然后随着逐步完善，在这几年偶尔也看到有人发过这东西的实现方法。 但我为什么要写这 ...
vscode Live Server插件问题修改
基于Windows11下Visual Studio Code中的Live Server插件使用过程中出现的问题与解决方法 本文字符约881个，阅读需10分钟 问题 Open a folder or workspace... (File -> Open Folder) 这个是没有打开文件夹 点击这个后 ...
前端视角看 HTTPS
最近用Docusaurus搭了一个个人网站，部署后看到浏览器地址栏上“不安全”三个字感觉特别辣眼，便不由自主的想起了HTTPS。回忆起自己在日常开发中遇到的一些与HTTPS相关的知识，忍不住想将这些年积累的一些细节和心得体会整理一下。 为什么要使用HTTPS HTTPS的发展历程是一段颇具趣味的历史 ...
H5 页面中实现跳转到其他 APP
H5 页面中实现跳转到其他 APP 在 H5 页面中跳转到其他 APP，可以使用以下几种方式： 1. URL Scheme（自定义协议） 许多 APP 都支持 URL Scheme 方式的跳转，例如： <a href="weixin://">打开微信</a> <a href="alipay://"> ...
记录---浏览器多窗口通信有效实践总结
写在开头 点赞 + 收藏 学会 如何跨越不同窗口通信 在现代 Web 开发中，多个窗口或标签页之间的通信成为了越来越常见的需求，尤其是在应用需要同步数据、共享状态或进行实时更新的场景中。不同窗口间的通信方式有很多种，选择合适的方式可以大大提高开发效率和用户体验。本文将详细介绍 ...
HTML5 微数据规范
HTML5 微数据规范 简介 微数据是一种内置于 HTML 中的结构化数据格式。它允许网页作者定义页面上的特定内容类型，例如文章、事件或人物。这有助于机器（例如搜索引擎）理解和解释网页内容。 微数据的基本概念 项目（Items）：一个微数据项代表页面上的某个对象或实体，例如一个人、一本书或者一个 ...
【3分钟学会】一招禁用表单中input输入框回车键自动触发提交事件！
本文旨在探讨如何在Web开发中处理Form表单的input输入框，特别是如何通过编写代码来禁用用户按下回车键时自动触发的表单提交事件。这涉及到理解表单事件处理机制，以及如何使用JavaScript或HTML属性来阻止回车键默认行为，从而增强用户体验和表单的功能性。 ...
Input报错“Form elements must have labels: Element has no title attribute Element has no placeholde”
写表单，无需 label 标签，只需给 input 添加 title 或 placeholder 任一属性，即可消除浏览器后台管理的Error~ ...
2024前端高频面试题之一
1.从输入URL到页面显示发生了什么 (1) 缓存查询(查询优先级:浏览器缓存,系统缓存,路由器缓存) (2) DNS解析,把网址解析唯一IP 【网址是为了方便记忆】 (3) 执行tcp三次握手,建立http链接 (4) 浏览器拿到返回的数据渲染页面 【可能存在跨域问题】 (5) 断开tcp连接 2 ...
markdown的html优雅使用语法（2024/10/10guixiang原创）
一：图片部分 因为博客园可能会吞我语法，所以我把代码放到下面部分 https://files.cnblogs.com/files/blogs/827070/markdown的优雅html语法.zip?t=1757144163&download=true 第一范式 图 2 全字段排序 <center> ...
小米13T Pro系统合集：性能与摄影的极致融合，值得你升级的系统ROM
小米 13T Pro 是一款性能卓越、设计精美的旗舰机型，具备多项领先配置，且在与前一代产品及友商机型的对比中优势明显，值得深入探讨。 性能提升 小米 13T Pro 搭载了最新的 天玑 9200+ 处理器，相较于前一代（小米 12T Pro）的 骁龙 8+ Gen 1，在性能和能效表现上均有显著提 ...
HTML 文本格式化
HTML 提供了丰富的元素来格式化文本和展示内容，这些元素不仅让网页内容更加丰富多彩，还提高了内容的可读性和表达力。下面是对您提到的一些文本格式化标签和“计算机输出”标签的进一步解释和说明： 文本格式化标签 <b> 和 <strong>：两者都用于加粗文本，但 <strong> 在语义上更强调文本的 ...
