前端技术文章

  • CSS首行文本样式设置技巧
    CSS首行文本样式设置技巧
    ::first-line伪元素用于对块级元素的第一行文本应用样式。1.它只能应用于块级元素如p、h1-h6、div,不支持行内元素如span;2.支持字体、颜色、背景和文本装饰属性,不支持margin、padding等布局属性;3.与::first-letter不同,后者针对第一个字符且支持布局属性;4.常用于强调段落起始,提升可读性,但应避免过度使用。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • jQuery表单提交获取JSON数据教程
    jQuery表单提交获取JSON数据教程
    本文介绍如何在jQuery表单提交时,将多类型表单控件(文本框、单选、复选、下拉、文本域)自动聚合成符合语义的JavaScript对象——单值保留字符串,多值(如复选框、多选下拉)自动转为数组,无需手动遍历拼接。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • CSS如何修改滚动条颜色?scrollbar-color教程
    CSS如何修改滚动条颜色?scrollbar-color教程
    scrollbar-color仅Firefox原生支持,Chrome/Edge需用::-webkit-scrollbar;其值为滑块色和轨道色,顺序不可颠倒,且不能被WebKit伪元素覆盖。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • 盒模型变化后如何调整尺寸?掌握影响因素
    盒模型变化后如何调整尺寸?掌握影响因素
    display属性切换导致尺寸突变的根本原因是不同值触发的盒模型行为完全不同:inline元素忽略宽高和上下边距,需改用inline-block或block;display:none切换会引发重排,应预留空间或用visibility/opacity替代;flex/grid中子项display变化不脱离容器布局逻辑;table相关值启用表格算法,易引发意外重算。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • 浮动定位混用怎么解决
    浮动定位混用怎么解决
    浮动与绝对定位本质冲突,混用会导致布局错乱、高度塌陷等问题;因absolute完全脱离文档流,会忽略float声明,应明确职责、择一使用,优先采用Flexbox或Grid等现代布局方案。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • 绝对定位元素margin偏移问题详解
    绝对定位元素margin偏移问题详解
    绝对定位元素的margin看似无效,实则影响盒模型边界而非定位;真正控制位置的是top/right/bottom/left;仅当这些值为auto(如margin:auto居中)时margin才参与定位计算。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • WebGL光照阴影效果实现教程
    WebGL光照阴影效果实现教程
    答案:结合PBR与阴影映射可在WebGL中实现物理光照与阴影。首先在片元着色器中使用BRDF模型(如GGX)计算基于反照率、金属度、粗糙度和法线贴图的光照响应,支持环境光、点光源等类型;接着通过深度纹理实现阴影映射——从光源视角渲染场景生成shadowmap,在主通道中将片段深度与shadowmap比较以判定阴影,并采用PCF滤波软化边缘;若集成Ammo.js等物理引擎,需每帧同步物体变换矩阵并更新光源视图矩阵,动态物体实时更新shadowmap,静态物体检影烘焙以优化性能;建议采用级联阴影映射提升远距离
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • JavaScript类型转换详解及实例分析
    JavaScript类型转换详解及实例分析
    JavaScript隐式转换是值在不同上下文中自动类型转换:加号优先字符串拼接,算术符强制转数字,条件判断转布尔(仅false、0、-0、""、null、undefined、NaN为假),==宽松比较会类型调和,===严格比较不转换。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • HTML列表排版实用技巧分享
    HTML列表排版实用技巧分享
    应使用语义化列表标签:无序内容用<ul>,有序步骤用<ol>,条目必须为<li>;避免<div>模拟列表;CSS控制外观时拆解list-style属性;横向布局用flex;坚持原生标签保障可访问性。
    文章 · 前端   |  6个月前  |   480浏览 收藏
  • Vite依赖预构建原理全解析
    Vite依赖预构建原理全解析
    Vite通过依赖预构建提升开发效率,利用esbuild将CommonJS/UMD转换为ESM,减少HTTP请求并加快加载速度;通过缓存机制和智能增量更新实现秒级重启,结合optimizeDeps配置可优化大型项目性能。
    文章 · 前端   |  7个月前  |   480浏览 收藏
  • JavaScript本地存储使用详解
    JavaScript本地存储使用详解
    localStorage和sessionStorage只支持字符串值,存对象需JSON.stringify()、取时用JSON.parse()并加try/catch;前者同源永久存储,后者仅限当前tab;敏感信息勿存,注意容量限制与XSS风险。
    文章 · 前端   |  7个月前  |   480浏览 收藏
  • ES6模块导出导入全解析
    ES6模块导出导入全解析
    ES6模块是原生静态系统,import必须顶层以支持编译期分析;命名导出需大括号且名称一致,default导出可重命名;路径须带扩展名或斜杠,裸导入需导入映射。
    文章 · 前端   |  7个月前  |   480浏览 收藏
  • HTML5Canvas绘图入门技巧解析
    HTML5Canvas绘图入门技巧解析
    canvas标签本身不绘图,仅提供空白画布,绘图需通过JavaScript调用getContext('2d')获取2D渲染上下文;width/height须用HTML属性设置,CSS仅缩放;drawImage需确保图像加载完成;clearRect清除像素,save/restore管理绘图状态。
    文章 · 前端   |  7个月前  |   480浏览 收藏
  • CSS伪元素::marker颜色自定义技巧
    CSS伪元素::marker颜色自定义技巧
    ::marker是CSS伪元素,用于设置列表项前的标记样式。通过color属性可直接修改符号颜色,如li::marker{color:red;}将项目符号变为红色。支持color、content、text-shadow及部分字体属性。现代浏览器兼容良好,IE不支持。兼容性要求高时可用list-style:none结合::before自定义。
    文章 · 前端   |  7个月前  |   480浏览 收藏
  • JavaScriptWebComponents实战指南
    JavaScriptWebComponents实战指南
    构建可复用组件需封装、独立与易集成,WebComponents提供原生支持。1.使用CustomElements定义自定义标签,通过customElements.define()注册继承HTMLElement的类,实现自定义元素;2.结合ShadowDOM隔离样式与结构,在构造函数中调用attachShadow()并设置shadowRoot.innerHTML,避免全局污染;3.支持属性与事件,通过observedAttributes监听属性变化,attributeChangedCallback触发更新,
    文章 · 前端   |  7个月前  |   480浏览 收藏
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    516次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    500次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    485次学习
  • Golang深入理解GPM模型
    Golang深入理解GPM模型
    Golang深入理解GPM调度器模型及全场景分析,希望您看完这套视频有所收获;包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
    474次学习
查看更多
AI推荐
  • SuperCLUE中文大模型评测基准:功能、能力维度与应用指南
    SuperCLUE
    SuperCLUE是权威的中文大语言模型综合评测基准,涵盖语言理解、知识应用、AI Agent智能体及安全性等12项核心能力。通过多轮对话与客观测试,定期发布榜单与技术报告,为模型研发、优化及行业选型提供科学依据。
    162次使用
  • C-Eval中文评测基准:大语言模型多学科能力评估指南
    C-Eval
    深入了解C-Eval中文评估套件,涵盖52个学科与4级难度。本文详解其功能特点、Zero-shot/Few-shot使用方法及代码示例,助您全面评测LLM中文理解与泛化能力。
    88次使用
  • LangGPT提示词框架:结构化Prompt设计方法与开源工具指南
    LangGPT
    LangGPT是一种受编程语言启发的结构化提示词设计工具,提供双层框架、模块化模板及变量功能,帮助用户高效编写高质量Prompt。该项目已在GitHub免费开源,适用于内容创作、编程辅助等多场景。
    7次使用
  • ClickPrompt:AI提示词生成与优化工具,支持Stable Diffusion、ChatGPT及代码辅助
    ClickPrompt
    ClickPrompt是一款专为AI提示词编写者设计的开源在线工具,支持Stable Diffusion绘图、ChatGPT对话及GitHub Copilot代码辅助。提供Prompt自动生成、一键运行、社区分享及可视化优化功能,帮助用户高效获取精准AI输出。
    49次使用
  • PromptHero官网:AI提示词搜索、优化与学习平台,支持Midjourney/Stable Diffusion
    PromptHero
    PromptHero是专业的AI提示词搜索引擎与优化平台,支持Stable Diffusion、Midjourney等主流模型。提供海量提示词库、分类搜索、在线课程及社区互动,助力用户高效生成高质量AI图像与文本。
    32次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码