- 博客(15)
- 收藏
- 关注
RSS订阅原创 Vue事件处理全解析：从基础到进阶
v-on:事件类型="方法名"@事件类型="方法名"键盘事件：通过.按键名修饰符监听特定按键组合键事件：通过多个修饰符组合监听组合键掌握这些事件处理方式，能让我们更高效地实现各种交互逻辑，提升用户体验。在实际开发中，根据场景选择合适的事件处理方式，可以让代码更加简洁易读。
2025-10-27 20:05:55
336
原创 JS 中DOM节点的获取、创建、插入、属性修改
④.querySelectorAll 通过CSS选择器获取节点，返回NodeList对象（包含所有匹配给定选择器的节点）下面我们来说说dom节点是如何实现增，删，改，查的吧。②.getElementsByClassName 通过class名来获取元素节点（若有多个相同class，返回含有多个节点的类数组对象）③.getElementById 通过id名来获取元素节点（直接返回可操控的节点，而不是由节点构成的数组对象）通过上面的解释，接下来我们做一个小练习吧~以下是上述题目的答案。
2025-09-18 22:42:47
493
原创 CSS核心布局：浮动，清除浮动与display属性解析
本文解析了CSS布局中的核心属性：浮动、清除浮动和display。浮动(float)让元素脱离文档流，实现多列布局，但会导致父元素高度塌陷；清除浮动(clear)通过不同取值解决塌陷问题。display属性控制元素显示类型：inline(行内)、block(块级)、none(隐藏)和inline-block(行内块)，是实现各种布局的基础。理解这些属性的原理和用法，是构建页面结构和实现响应式设计的关键，后续结合定位(position)等属性可完成更复杂的布局效果。
2025-06-04 22:37:52
574
原创 深入理解CSS浮动：三大核心要点解析
浮动曾是CSS布局的核心工具，但其脱离文档流、高度塌陷等问题也带来了维护成本。现代开发中，Flexbox和Grid布局更适用于复杂场景，而浮动仍保留以下适用场景：实现文本环绕图片的经典效果。构建简单的多列布局（需配合Clearfix）。兼容旧版本浏览器时的降级方案。理解浮动的核心机制，既能帮助开发者维护遗留代码，也能更深刻地体会CSS布局设计的演进逻辑。
2025-05-21 20:41:43
1139
原创 CSS 绝对定位实例解析 - 卡通人脸绘制
通过这个卡通人脸案例，我们可以清晰看到绝对定位在复杂组件布局中的优势。合理运用定位层级和坐标计算，可以创建各种精致的界面元素。需要注意避免过度使用绝对定位导致的响应式问题，在固定尺寸场景下这是非常有效的布局方案
2025-05-14 20:09:56
524
原创 一篇博文带你了解CSS中选择器的类型和应用（这些小细节也要抓起来哦）
CSS选择器是构建精美网页样式的基础，通过合理的运用交集选择器，并集选择器以及各种关系选择器，开发者可以更加灵活，精确的控制网页元素样式，从而打造出对用户体验更好，视觉效果更出色的网页。
2025-04-20 00:00:11
715
原创 CSS课堂总结，引入方式与选择器优先级
在前端开发中，是用于美化网页不可或缺的工具。今天在课堂上，我们进行了关于CSS引入方式和选择器优先级的练习，下面是对这些内容的总结。
2025-04-10 20:35:15
551
原创 用HTML搭建一个简易的校园网框架
通过以上图片我们清楚的了解到这个网站所具有的各项功能，虽然现在看起来有一点简陋，而且也不美观，今天我们的主要目的是用HTML把这个网站的基础框架构建起来，到了后面css部分，我们可通过css来美化这个网页
2025-04-05 15:01:54
892
原创 用HTML设计一个表单案例
(1)、HTML表单–输入标签–<input>：表单中最常用的标签为<input>标签，<input>标签为单标签，使用type属性来决定不同的输入类型。这个类型表示输入框为密码框，里面可以填写数字，字母，中文等所有东西，但是输入的内容都会被隐藏起来。（1）表单中action属性，里面填写的是后台服务器的地址，表示向何处发送数据。今天我们将学习HTML的表单设计，那么如何实现上述图片的效果呢，接下来让我们一探究竟。这个类型表示输入框为文本输入框，用户可以在文本输入框中输入数字，字母，中文等任何东西。
2025-03-31 12:53:38
678
原创 用HTML做一个简单，而又不规则的表格
HTML 表格用 <table> 标签来定义，是用来展示结构化数据的一种元素。每个表格包含若干行（用 <tr> 标签），每行由多个单元格组成（用 <td> 标签）。表格还可以有标题行（用 <th> 标签），用于显示列的标题。<th> 是 "table header" 的缩写，表示表格中的表头单元格。<td> 是 "table data" 的缩写，表示表格中的数据单元格。<tr> 是 "table row" 的缩写，表示表格中的一行。
2025-03-23 23:09:58
1070
原创 《别在吃土了，JavaScript教你‘骗’出账户里的钱》
JavaScript是一种高级的脚本语言，对于推动Web技术发展，跨平台移动应用的开发和游戏及其它领域开发有着重要的意义，为游戏开发提供了一种轻量级的解决方法，学好了JavaScript我们的能力将更上一层楼，接下来的时间你也试试看吧，有任何问题欢迎与我探讨哦~~~
2025-03-05 23:30:31
317
原创 《探寻网页美学背后的魔术师，用CSS样式创造无限可能》
CSS，作为网页世界里的魔法画笔，我们才到最开始懵懵懂懂用color为文字添彩的阶段，这条路上满是探索，前路漫漫充满未知与挑战，而我们带着对美的追求和技术的热爱，继续在CSS天地里疾驰，书写属于自己的篇章。希望这段CSS小结能帮助到你，如果有其它意见欢迎随时告诉我。
2025-03-03 16:29:31
426
原创 《用HTML代码搭建一个简单的水果网页》
通过以上的HTML代码大家是不是对HTML的操作有了更加深刻的认识了呢，这些代码帮助我们实现了一个较为基础的网页，掌握了这些基本的知识，我们也算是迈入了前端操作的门槛，后面还有更加严峻的挑战在等着我们，希望这篇博客能帮助你更好的理解HTML的功能。为什么不用<h1>的原因是<h1>通常代表页面中最重要的标题，一个页面一般只用一个<h1>标签，而二级标题的重要性仅次于<h1>可在一个页面中多次使用，故此用<h2>标签来阐述。接下来，用<a>标签创立超链接，用户可以点击此链接查看不同水果的图片。
2025-03-02 22:25:07
480
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人