前端技术文章
-
- 组件化开发详解:WebComponents标准全解析
- WebComponents是基于标准WebAPI的原生组件化技术,由CustomElements、ShadowDOM和HTMLTemplates三大技术构成,支持创建可复用、样式隔离的自定义元素;通过customElements.define()定义标签,attachShadow()创建影子根实现封装,结合<template>与<slot>构建结构;示例中MyCard组件在HTML中以<my-card>使用,具备独立样式与DOM隔离;其优势在于原生性、跨框架兼容、无依赖
- 文章 · 前端 | 6个月前 | 组件化开发 492浏览 收藏
-
- Unity显示HTML内容的实用方法与技巧
- 使用Webview插件可在Unity中嵌入HTML内容,支持移动端和桌面端;本地HTML可通过StreamingAssets目录加载,简单富文本可用TextMeshPro的富文本功能实现,复杂内容建议结合服务器解析后动态展示。
- 文章 · 前端 | 6个月前 | 网页HTML 492浏览 收藏
-
- HTML5如何使用@font-face添加自定义字体
- 可通过CSS的@font-face规则引入自定义字体,需声明字体族名、指定多格式文件路径(WOFF2/woff/TTF)、应用时匹配名称并设回退字体,注意跨域限制及用开发者工具验证渲染效果。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- CSSGrid布局实战教程
- Grid定骨架,Flex理细节。先用Grid划分整体结构,再在区域内用Flex布局子元素,结合嵌套与媒体查询实现响应式,分层构建清晰可控的复杂页面。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- CSS标记颜色改不了?试试color配合list-style-type
- 应使用color配合list-style-type让标记继承文字色,而非依赖不兼容的::marker;li设置color即可改变内置标记颜色,兼容所有主流浏览器。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- JavaScript数组扁平化技巧与flat用法
- 本文旨在深入探讨JavaScript中数组扁平化的常见误区及正确实现方法。我们将剖析Array.prototype.concat()不修改原数组的特性,并介绍两种有效的扁平化策略:利用扩展运算符配合push()方法,以及更现代、简洁的Array.prototype.flat()方法,帮助开发者高效处理嵌套数组。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- CSS数据流程线制作教程详解
- 在CSS中使用伪元素制作数据步骤流程线,核心是利用::before和::after生成视觉组件而不增加DOM节点。1.HTML结构采用无序列表组织步骤项;2.父容器用flex布局排列步骤;3.每个步骤相对定位并使用::before绘制节点圆圈;4.使用::after绘制连接线;5.通过状态类控制不同步骤样式(如.completed、.active);6.响应式设计通过媒体查询切换垂直布局或滚动实现;7.文字对齐通过flex和margin调整;8.复杂连接线可用border或SVG实现。伪元素减少了DOM复
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- HTML中汉字编码设置与显示教程
- 应声明UTF-8编码并确保文件保存为UTF-8无BOM格式,同时配置HTTP响应头、统一外部资源编码、校验HTML结构及转义特殊字符。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- Web Components如何与现代前端框架协同工作?
- WebComponents与现代前端框架可协同工作,实现跨项目复用。1.React中需注意属性传递、事件监听及警告规避;2.Vue3可通过配置识别自定义元素,支持属性绑定与事件通信;3.Angular天然兼容WebComponents,可直接使用并利用ShadowDOM隔离样式;4.借助WebComponents构建跨框架组件库,实现一次开发、多处运行,推荐使用Lit或Stencil开发高性能组件,框架负责逻辑,WebComponents负责可移植UI。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- Mac Ulysses出版模式,HTML+CSS导出零瑕疵!
- 要实现Ulysses内容零瑕疵HTML+CSS导出,需正确配置导出设置或自定义模板。1、使用内置导出功能时,勾选包含CSS样式以保留基础排版;2、通过创建自定义主题并编辑style.css文件,可完全控制导出样式;3、手动提取导出HTML的内容片段,嵌入外部网页框架,并调整CSS优先级避免冲突;4、预处理Markdown源码,利用正则替换增强结构控制,再用Pandoc等工具转为HTML并附加定制样式,确保最终输出符合发布或存档要求。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- JavaScript事件系统原理与设计解析
- 答案:自定义事件系统通过on、off、once、emit实现对象间解耦通信,支持事件监听与触发,可扩展批量清除、最大监听数限制等功能,适用于组件通信等场景。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- CSS文本高亮设置技巧分享
- ::selection伪元素用于自定义用户选中文本的样式,如背景色、文字颜色等。它支持color、background-color、cursor和text-shadow属性,常用于提升页面视觉一致性。例如设置::selection{background-color:yellow;color:darkred;}可使全局限选文本呈现黄底深红字。可通过p::selection或.highlight::selection为特定元素定制样式。现代浏览器普遍支持,但需注意避免刺眼配色、保证可读性与对比度,并进行多端测
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- HTML课程表注册表单制作教程
- 使用HTML创建课程表注册表单需包含:1.以method="post"、action="#"的<form>包裹;2.学生信息(姓名、学号、年级)带label和required;3.课程复选框name="courses[]";4.时间段与班级编号限制;5.提交按钮带确认提示。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- Selenium动态下拉处理方法详解
- 本教程详细介绍了如何使用PythonSelenium与网页上的特定下拉菜单进行交互,特别是如何选择下拉选项。文章通过具体的代码示例展示了定位和点击下拉按钮及选项的方法,并强调了在可能的情况下,优先考虑使用API进行数据抓取,以提高效率和稳定性。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
-
- Flexbox按钮组布局技巧分享
- 使用Flexbox结合flex-wrap和gap属性可实现响应式按钮组布局,通过display:flex启用弹性布局,flex-wrap:wrap允许按钮换行,gap设置间距,避免兼容性问题可用margin替代,配合媒体查询在小屏下切换为垂直排列并调整间距,提升多设备适配性与用户体验。
- 文章 · 前端 | 6个月前 | 492浏览 收藏
查看更多
课程推荐
-
- 前端进阶之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推荐
-
- ljg-skills
- ljg-skills 是李继刚开源的 AI 技能与提示词集合,面向大模型使用者整理了一批可复用的 prompt、角色设定和任务技能模板,适合用于学习提示词设计、搭建个人 AI 工作流和沉淀团队常用智能体能力。
- 3301次使用
-
- MELO音乐
- MELO音乐是一站式AI视频与音乐制作助手,对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐,MELO为你免费谱曲,轻松做同款!
- 3051次使用
-
- UniScribe
- UniScribe 是一款 AI 音视频转文字与内容整理工具,支持上传音频、视频文件或粘贴 YouTube 链接,自动生成转写文本、摘要、思维导图和关键问题,并支持多格式导出,适合会议记录、课程学习、访谈整理和内容创作复盘。
- 3000次使用
-
- 剧云
- 剧云是专业中文剧本创作平台,安全稳定运行十余年,集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能,数据安全防护,轻松高效创作剧本。
- 3212次使用
-
- 万象有声
- 万象有声,一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具,可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验,让有声书制作更简单!
- 3167次使用

