Html/Css

纯前端实现图片伪3D视差效果-牛翰网

纯前端实现图片伪3D视差效果

本文通过depth-anything获取图片的深度图,同时基于pixi.js,通过着色器编程,实现了通过深度图驱动的伪3D效果。该方案支持鼠标/手势与手机陀螺仪双模式交互,在保证性能的同时,为不同终端用户...
d00cd3c84ec7dc3b的头像-牛翰网vivo互联网技术1个月前
0276
Web前端入门第 51 问:移动端适配的视口元标签(meta)常见使用场景-牛翰网

Web前端入门第 51 问:移动端适配的视口元标签(meta)常见使用场景

经常查看网页源码的同学应该都有注意到,基本上面向移动端的所有网站都有个 <meta name="viewport" xxx> 这样的HTML元素。 为什么需要 meta 标签? 在移动端刚起步的时候,默认...
822df9bcef4afff8的头像-牛翰网前端路引3个月前
04611
Web前端入门第 49 问:CSS offset 路径动画演示-牛翰网

Web前端入门第 49 问:CSS offset 路径动画演示

什么是路径动画? 随手画一条不规则的线,让元素按照这条不规则的线运动起来,这就是所谓的路径动画。 前面说过的动画都只能针对某一个 CSS 属性,要想实现路径动画可没办法,路径动画必须借助 ...
822df9bcef4afff8的头像-牛翰网前端路引3个月前
03211
国际化利器 Intl Messageformat-牛翰网

国际化利器 Intl Messageformat

我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。 本文作者:霜序 Formats ICU Message strings with number...
06cc2066c5b1b91b的头像-牛翰网袋鼠云数栈前端3个月前
04211
CSS 魔法与布局技巧-牛翰网

CSS 魔法与布局技巧

CSS 布局与视觉效果常用实践指南 在我一篇随笔中其实有说到十大布局,里面有提到 flex 布局、grid 布局、响应式布局,不过没有提到容器查询这个,现在说下这三个布局然后穿插下容器查询把。 1️...
0ee315a8055889c3的头像-牛翰网幼儿园技术家3个月前
02910
记录---7 种常见的前端攻击-牛翰网

记录—7 种常见的前端攻击

🧑‍💻 写在开头 点赞 + 收藏 学会🤣🤣🤣 大家都知道,保证网站的安全是十分重要的,一旦网站被攻陷,就有可能造成用户的经济损失,隐私泄露,网站功能被破...
f381afebbfe2b7b2的头像-牛翰网林恒3个月前
05113
至美!看AXUI如何美化原始HTML标签(reset/normalize)-牛翰网

至美!看AXUI如何美化原始HTML标签(reset/normalize)

现代前端开发通常在项目初始化阶段就会采用样式重置(reset)或规范化(normalize)技术,对原始 HTML 标签进行“统一外观”处理。这不仅是为了美观,更是为了构建一致的视觉和交互基准。我们在...
0bc172d911893723的头像-牛翰网末日的狂欢姐3个月前
0468
Less中实现响应式设计的4种高效方案(手机、平板、电脑端)-牛翰网

Less中实现响应式设计的4种高效方案(手机、平板、电脑端)

下是4种纯Less实现的响应式方案,均封装成可复用方法。 方案1:基础设备混合封装 // 定义设备断点变量 @mobile-max: 767px; @tablet-min: 768px; @tablet-max: 1024px; @desktop-min: 1025px; /...
e245851883ca985c的头像-牛翰网走,板砖去3个月前
0549
AI 大模型科普-概念向-牛翰网

AI 大模型科普-概念向

我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。 本文作者:奇铭 什么是大模型(LLM) 大模型(LLM)即大型...
06cc2066c5b1b91b的头像-牛翰网袋鼠云数栈前端3个月前
0428
记录---只需一行代码,任意网页秒变可编辑!-牛翰网

记录—只需一行代码,任意网页秒变可编辑!

🧑‍💻 写在开头 点赞 + 收藏 学会🤣🤣🤣 在我们日常工作中,可能会遇到截图页面的场景,有时页面有些内容不符合要求,我们可能需要进行一些数值或内容的修...
f381afebbfe2b7b2的头像-牛翰网林恒4个月前
0537