前端css
震惊！对话就能生成网页，前端er又药丸了？
前两天，Vercel突然推出了v0.dev，用户通过语言描述就能生成精美UI页面，小伙伴们惊掉了下巴。。 V0是何方神圣 带着期待的心情对官网https://v0.dev一番摸索的探索，了解到v0是通过AI模型技术生成交互页面，当前官网的交互是基于Shadcn UI和Tailwind CSS，最终生 ......
前端远程调试方案 Chii 的使用经验分享
前端远程调试方案 Chii 的使用经验分享 Chii 是与 weinre 一样的远程调试工具 ，主要是将 web inspector 替换为最新的 chrome devtools frontend 监控列表页面可以看到网站的标题链接，IP，useragent，可以快速定位调试页面，监控页信息完善，支 ......
css用absolute解决flex布局下flex-grow:1的情况滚动布局撑开父节点的问题
描述： 因为个人很喜欢flex布局，所以在做某个项目html框架的时候，会有如下这种情况出现 一个很简单的布局，大的盒子下包含了两个子盒子，第一个子盒子的高度固定，现在要让第二个盒子自适应撑满父布局剩下的高度，自然用css很简单实现 设定一个flex，然后grow为1就行 .container1 { ......
前端模块化
1.为什么需要模块化 随着前端应用的日益复杂，我们的项目代码已经逐渐膨胀到了不得不花大量时间去管理的程度了。而模块化就是一种最主流的代码组织方式，它通过把复杂的代码按照功能的不同划分为不同的模块单独维护，从而提高开发效率、降低维护成本。模块化可以使你能够更容易地重用代码。你可以创建一个模块来完成一个 ......
前端一些常用的正则表达式
一、校验数字的表达式 1 数字： ^[0-9]$ 2 n位的数字： ^\d{n}$ 3 至少n位的数字： ^\d{n,}$ 4 m-n位的数字：^\d{m,n}$ 5 零和非零开头的数字：^(0|[1-9][0-9]*)$ 6 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0- ......
若依管理系统-岗位管理前端代码解析
1 vue代码 前端基本采用Element-UI组件。 1.1 界面 1.1.1 查询界面 1.1.1.1 使用el-form组件。 <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="s ......
脱发秘籍：前端Chrome调试技巧汇总
脱发秘籍：前端Chrome调试技巧汇总 Chrome浏览器调试工具的核心功能： 🥷🏻注：本文测试、截图均为Edge浏览器（内核是Chromium），浏览器内核可了解《有哪些浏览器/内核？》 00、基础操作汇总 操作类型快捷键/说明 切换浏览器标签 🔸 Ctrl+1到8切换到对应序号的浏览器标签 ......
html前端页面多规格商品sku选择
<style> body { background-color: palegoldenrod; position: relative; } footer { border: 1px solid red; height: 50px; position: fixed; bottom: 0; left: ......
前端设计模式：单例模式（Singleton）
单例模式（Singleton Pattern），也称单体模式，就是全局（或某一作用域范围）唯一实例，大家共享、复用一个实例对象，也可减少内存开销。单例模式应该是最基础、也最常见的设计模式了。 ......
CSS MASK
首先看如下效果： 这种效果看起来很赞，可以做出很酷炫的交互，比如图上这种，还有一种就是引导页 经过我阅读作者的文章，原文地址。 发现其实只要使用两个核心CSS样式就能实现这个效果 分别为： 1. backdrop-filter: blur(5px); -webkit-mask: radial-gra ......
介绍一下CSS的盒子模型
CSS的盒子模型有哪些：标准盒子模型、IE盒子模型 CSS的盒子模型区别： 标准盒子模型：margin、border、padding、content IE盒子模型 ：margin、content（ border + padding + content ） 通过CSS如何转换盒子模型： box-siz ......
纯 CSS 实现波浪效果！
纯 CSS 实现波浪效果！ 一直以来，使用纯 CSS 实现波浪效果都是十分困难的。 因为实现波浪的曲线需要借助贝塞尔曲线。 而使用纯 CSS 的方式，实现贝塞尔曲线，额，暂时是没有很好的方法。 当然，借助其他力量（SVG、CANVAS），是可以很轻松的完成所谓的波浪效果的，先看看，非 CSS 方式实 ......
【前端性能】高性能滚动 scroll 及页面渲染优化
【前端性能】高性能滚动 scroll 及页面渲染优化 最近在研究页面渲染及web动画的性能问题，以及拜读《CSS SECRET》（CSS揭秘）这本大作。 本文主要想谈谈页面优化之滚动优化。 主要内容包括了为何需要优化滚动事件，滚动与页面渲染的关系，节流与防抖，pointer-events:none ......
2-微信小程序和web前端的差异及模板与配置
上文学会了如何安装微信小程序的安装与注册，及微信小程序的使用，其实微信小程序和web前端也有异曲同工之妙 微信小程序和Web前端存在一些显著的区别和差异，这些差异主要体现在功能、性能、用户体验、开发成本和维护成本等方面。 一、相似点 语言基础：微信小程序和Web开发都使用JavaScript语言进行 ......
03 CSS快速入门 , 和优势
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>学习css</title> <!--规范，<style>写css,每一个声明，最好使用分号结尾--> 选择器{ 声明1; 声明2; 声明3; } <link r ......
02 什么是CSS 和 发展史
  ![](https://img2023.cnblogs.com/blog/3071897/202309/3071... ......
css让某个view/div 定在某一个位置不动
position: absolute 可以定位在某个位置，但是会跟着滚动条的位置而改变。 postion: fixed 可以定位在某个位置，并且也不会跟着滚动条的位置而改变。 postion:fixed left:0px; bottom:0px; 会定位在底部左边位置。比如返回顶部/返回等。 ......
浅析微前端沙箱
前言 在大型项目中，微前端是一种常见的优化手段，本文就微前端中沙箱的机制及原理，作一下讲解。 首先什么是微前端 Techniques, strategies and recipes for building a modern web app with multiple teams that can ......
ES14新特性揭秘，对前端开发有哪些影响？
ECMAScript 2023也就是ES14已经发布3个月了，还有好多小伙伴没有关注到ES14有哪些变化，本文将为大家梳理下ES14最新规范新增功能：对数组的新增功能，对shebang的支持，对弱引用集合的符号键的扩展。这个版本的都是一些细微的改进，我们一起看看有哪些变更 目录 Array.prot ......
【前端攻略】：玩转图片Base64编码
【前端攻略】：玩转图片Base64编码 引言 图片处理在前端工作中可谓占据了很重要的一壁江山。而图片的 base64 编码可能相对一些人而言比较陌生，本文不是从纯技术的角度去讨论图片的 base64 编码。标题略大，不过只是希望通过一些浅显的论述，让你知道什么是图片的 base64 编码，为什么我们 ......
前端读取目录下所有指定文件
读取modules下文件示例: /** require.context： 1. 指定目录 2. 是否将匹配层级递归至子目录下 3. 匹配的文件 */ const modulesFiles = require.context("./modules", true, /\.js$/); const mod ......
HTML+CSS学习笔记
HTML骨架：（VS Code 可以快速生成骨架：在 HTML 文件（.html）中，!（英文）配合 Enter / Tab 键） html：整个网页 head：网页头部，用来存放给浏览器看的信息，例如 CSS title：网页标题 body：网页主体，用来存放给用户看的信息，例如图片、文字 常用标 ......
CSS重置样式
CSS重置样式，指的是使用CSS来重置浏览器的默认样式。每个浏览器都有一套自己的默认样式，比如在某些浏览器里，<h1>标签的默认字体大小可能是32px，而在其他浏览器里可能是30px。当你使用CSS来重置浏览器的默认样式时，你将能够确保你的网页在所有浏览器中看起来更加一致。 下面是一个常见的CSS重 ......
TienChin 渠道管理-前端展示渠道信息
在编写 Vue 项目的时候我们可以使用 IDEA 当中提供的一个工具叫做 structure，也就是说可以很轻松的列举出当前 Vue 文件的大致结构，点那个就会跳转到对应的地方。 简简单单介绍一个编写Vue时的一个小技巧，那么接下来进入核心内容，展示渠道信息的开发。 在 api 文件夹模块当中新建一 ......
css 中 color 和 background-color 怎么区分
在CSS中，color和background-color代表了两种不同的样式属性： color：此属性用于设置元素的前景色，即元素内文本的颜色。例如： p { color: red; } 这将使所有<p>标签（段落）内的文本颜色变为红色。 background-color：此属性用于设置元素的背景色 ......
前端请求参数加密、.NET 后端解密
本文详细介绍了前端请求参数加密、.NET 后端解密，文章较长，请各位看官耐心看完。 目录一、前端使用“CryptoJS”，前端AES加密，.NET后端AES解密1.1、加密解密效果图1.2、CryptoJS介绍1.3、准备工作：安装“CryptoJS”1.3.1、使用npm进行安装1.3.2、Vis ......
关于jsp借助WebServlet注解跳转到对应的servlet，表示界面404，且注解在前端界面不被识别问题的解决
问题描述 我是属于那种习惯了使用其他框架之后，且，好久没有写过javaweb了，就忘记了jsp/html前端界面通过WebServlet注解跳转到servlet的方法，就这么一个破问题！！！ 坑了我一下午！！ 问题解决 起初我还以为是servlet-api的依赖没有导入进去，发现早就在pom.xml ......
一文带你弄懂 CSS 布局知识
大家好，我是树哥。 最近想着学习点前端知识，于是就学习了关于 Web 前端的布局知识，其实就是 CSS 那些事。关于 CSS 其实很早就接触过了，但一直没有沉下心来去学习，所以对于 CSS 布局的东西一直都不成体系。这次趁着重学前端，真正花时间学了一下 CSS 布局的知识点，顺带把知识点总结一下。 ......