前端技术文章
-
- CSS如何排除元素使用not伪类
- :not()伪类仅支持简单选择器,不可用于复合选择器;无法跨层级否定子元素,需用正向选择或分层类名;不改变优先级,多:not()链式使用表示“且”关系。
- 文章 · 前端 | 1个月前 | 491浏览 收藏
-
- 如何解决CSS类名冲突导致的UI错乱_通过BEM命名空间强制隔离
- BEM通过block__element--modifier命名结构建立样式隔离墙,防止命名冲突与作用域污染;block为独立可复用组件,element为其直属组成部分,modifier仅描述状态变体,三者职责分明、不可混用或跨层嵌套。
- 文章 · 前端 | 3星期前 | 491浏览 收藏
-
点击我CSS样式:添加基础样式和水波效果.ripple-btn { position: relative; overflow: hidden; padding: 15px 30px; background-color: #4CAF50; c">
点击我CSS样式:添加基础样式和水波效果.ripple-btn {
position: relative;
overflow: hidden;
padding: 15px 30px;
background-color: #4CAF50;
c">
- 点击我CSS样式:添加基础样式和水波效果.ripple-btn { position: relative; overflow: hidden; padding: 15px 30px; background-color: #4CAF50; c">CSS实现按钮点击水波效果的方法如下:HTML结构:创建一个按钮元素CSS样式:添加基础样式和水波效果.ripple-btn { position: relative; overflow: hidden; padding: 15px 30px; background-color: #4CAF50; c
- 真实水波效果需JS捕获点击坐标并动态创建span元素,结合CSS动画实现以点击点为圆心的扩散遮罩;必须用getBoundingClientRect()精确定位、设absolute与border-radius:50%、动画后remove元素;推荐@keyframes替代transition以提升控制力和性能,并统一处理touchstart/mousedown事件防多触发。
- 文章 · 前端 | 3星期前 | 491浏览 收藏
-
- 原型继承中子类污染父类属性的解决方法
- 子类实例污染父类原型属性源于在prototype上挂载可变对象导致共享引用,正确做法是将可变数据初始化于构造函数内,并对不可信输入过滤敏感键名、使用Object.create(null)及冻结关键原型。
- 文章 · 前端 | 2星期前 | 491浏览 收藏
-
- 合并表格单元格:colspan与rowspan技巧解析
- 合并表格单元格本质是定义矩形区域起点,后续行td数量须动态减去被colspan/rowspan占用的列数,否则引发结构错误而非渲染异常。
- 文章 · 前端 | 2星期前 | 491浏览 收藏
-
- 避免CSS嵌套过深,BEM结构降权技巧
- 最有效解法是用.block__element--modifier替代深层嵌套选择器,BEM本质是将DOM层级“翻译”为类名结构,实现浏览器单次匹配、开发者快速定位。
- 文章 · 前端 | 2星期前 | 491浏览 收藏
-
- CSS 过渡属性详解:transition-timing-function 和 transition-delay
- CSS过渡属性详解:transition-timing-function和transition-delay在开发网页和应用程序的过程中,我们经常会用到一些过渡效果,通过改变元素的样式属性来实现平滑的动画效果。CSS提供了一组过渡属性,其中两个非常重要的属性是transition-timing-function和transition-delay,
- 文章 · 前端 | 2年前 | CSS过渡属性详解:过渡方式 过渡延迟 490浏览 收藏
-
- 如何使用JS和百度地图实现地图街景功能
- 如何使用JS和百度地图实现地图街景功能地图街景功能是一种通过地图上的视角,让用户可以在电子地图上欣赏街景照片的体验。百度地图提供了强大的API,使得我们可以简单地使用JavaScript来实现这一功能。下面将详细介绍如何使用JS代码和百度地图API来实现地图街景功能。第一步:准备百度地图API的开发环境首先,需要在您的HTML文件中引入百度地图的API。使用
- 文章 · 前端 | 2年前 | JavaScript 百度地图 街景 490浏览 收藏
查看更多
课程推荐
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 485次学习
-
- Golang深入理解GPM模型
- Golang深入理解GPM调度器模型及全场景分析,希望您看完这套视频有所收获;包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
- 474次学习
查看更多
AI推荐
-
- 万象有声
- 万象有声,一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具,可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验,让有声书制作更简单!
- 6次使用
-
- Red Skill
- 小红书创作服务平台为小红书创作者和机构提供视频上传、数据分析、粉丝管理、创作指导等多项运营服务,助力用户解锁更多创作者专属功能,体验高效创作!
- 16次使用
-
- MiMo Code
- MiMo Code 是小米大模型团队开源的新一代 AI 编程助手,面向开发者提供代码理解、生成与辅助开发能力,适合作为 AI 编程工具收藏和体验。
- 106次使用
-
- TRAE Work
- TRAE AI IDE | 国内首款 AI 原生集成开发环境,深度集成 Doubao-1.5-pro 与 DeepSeek 模型,支持中文自然语言一键生成完整代码框架,实时预览前端效果并智能修复 BUG。首创 Builder 模式实现需求到代码的自动化开发,兼容 Windows/macOS 系统,官网下载即用。
- 132次使用
-
- MeloLab
- MeloLab 是一款 AI 音乐生成工具,可根据文本创意生成歌曲、人声、混音、分轨和背景音乐,适合创作者快速制作音乐素材。
- 113次使用

