前端的技巧记录

已于 2023-12-20 22:04:27 修改
阅读量109 收藏
点赞数
分类专栏： 知识点 实习 文章标签： 前端 css javascript html vue
于 2023-03-02 16:20:10 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/funnyqian123/article/details/129303344
版权
本文介绍了如何实现一个div元素悬浮在另一个div之上，以及在Vue框架中父组件如何通过props向子组件传递数据和子组件如何通过$emit向父组件发送数据。此外，还讲解了如何使用CSS创建文字渐变效果。
摘要由CSDN通过智能技术生成

目录

一、实现一个div悬浮在另一个div上

二、父组件向子组件传数据

三、子组件向父组件传数据

四、文字渐变色

一、实现一个div悬浮在另一个div上

Step1：把两个子div放到一个父div中，该父div只有这两个子div。

Step2：父div设置

position:relative;

Step3：显示在上方的div设置

position:absolute;left:0;top:0;

二、父组件向子组件传数据

1、父组件引入子组件，通过:message="data"注册属性message

2、子组件通过props获取到注册的属性message

三、子组件向父组件传数据

1、父组件通过@name="handle"注册事件event

2、子组件由transmit事件方法，通过this.$emit('name', data)向父组件传值

四、文字渐变色

1、在对应的样式中添加：

background: linear-gradient(90deg, #333300 0%, #19482F 99%, #19482F 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

持续更新~

前端编码技巧须知
jsPao的博客
11-23 1057
这些软件和工具根据实际需求选择使用，可以帮助开发者更高效地进行前端开发工作。
前端面试技巧
LittleRoundFace的博客
03-21 2638
前端面试葵花宝典 今天参加了一个分享大会，是关于前端面试的，虽然自己目前并无跳槽面试需求，但是觉得了解一下行业标准对自己现在查缺补漏更好一些。大会是线上的从早晨9点就开始了，一直到晚上七点多才结束，其实里面有10个分享嘉宾，不过我开头和中间有事都没有听见，听到的4~5个分享讲师分享的内容真的是干货满满，有点相见恨晚的感觉，于是会后我就想整理一下，让更多人也能有机会更早知道这些面试规则和技巧，早知道早去练习这些能力。对于准备跳槽的小伙伴会更有帮助。 注意：本文内容来自如下大会的各个大佬的讲课内容，我边听边做了
前端调试方法与技巧
m0_45127388的博客
11-12 5136
一、pc端项目（浏览器端的，主要指电脑端的网页） 调试方法 1、控制台或代码中善用console，它会清晰的打印出我们在执行中数据的值，方便查看。不要使用alert，因为alert是阻断线程运营的操作，当不点击当前alert的确定，下一个alert是不会出现且对数据较多时不友好。 2、 控制台中各功能按钮介绍 1、Element 源码定位 打开测试工具，点击箭头，在页面中选择要审查的元素，此时会定位在代码块，会有html及css布局的展示，可进行动态更改排查问题 若html中有调用事件，如何定位事件：el
前端必备技巧——抓包、调试
home of 倒不了的dota
07-05 1294
方式一：在页面元素上右键点击，选择检查方式二：使用快捷键⌘Opti。
前端网页开发debug调试基础技巧
长脖鹿的博客
03-16 2122
你可以逐行执行（Step Over），进入函数（Step Into），跳出函数（Step Out），或继续执行直到下一个断点（Resume）。在代码中找到你想要暂停执行的行。在代码暂停执行时，你可以查看和修改作用域中的变量值，检查调用栈，以及查看当前执行环境的状态。在“Sources”面板中，浏览或搜索到你想要调试的JavaScript文件，并打开它。在逐步执行代码时，观察应用的行为和控制台的输出，以帮助理解代码的执行流程和发现问题。当你的网页运行并执行到断点所在的代码行时，浏览器会自动暂停执行。
前端必备PS技巧
想搞全栈的前端
04-01 1278
PS在前端主要有两方面的应用：1：测量图像大小、距离 2：切图 测量不用说大家平时开发都需要用，而切图也是前端必备技能。我们作为前端会比UI更清楚我们需要的图片，有时候需要修改也可以自己动手，不必处处麻烦UI，也提高了工作效率。 那我们重零开始吧！ 1.下载工具PS 在这里分享一下正版PS安装包，内含注册码的，链接失效了可以下方评论。 下载链接：链接：https://pan.baidu.com/...
前端开发小技巧记录 - 持续更新
coding
11-18 7319
数据 1. 判断数据类型 const typeofData = o => o==null? String(o): Object.prototype.toString.call(o).slice(8, -1).toLowerCase()
前端调试小技巧之快速清除缓存
工一木子
11-04 3183
需求： chrome如何在不清除历史记录时快速清除缓存 解决： F12调试者模式下，鼠标放在刷新页面按钮下，右键点击清除缓存并硬性重新加载
前端基础学习笔记
sober30的博客
07-27 4525
css3有哪些新特性：圆角盒子阴影文本阴影不透明度 ：opacity 、rgba渐变背景 ：线性渐变、径向渐变背景属性：backgroud-size、background-clip（拓展）结构选择器：first-child()…伪元素新写法 :before ::before(css3) 为了和:hover之类的伪类选择器作区分弹性盒子：flex转换：2D转换、3D转换（拓展）过渡：一般搭配hover使用animation动画（拓展）媒体查询。
前端工程师晋升之路
2401_84092666的博客
04-22 963
javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。
每日前端面试题、技巧等知识点，记录自己的成长过程.zip
03-16
"每日前端面试题、技巧等知识点，记录自己的成长过程.zip"这个压缩包文件，显然包含了一位开发者整理的关于前端面试的常见问题、解题策略以及个人学习成长的记录。通过这个资源，我们可以了解到前端开发者在面试过程...
WEB前端面试技巧
11-06
面试完了多总结自己哪里做得不好，哪里做得好，都记录下来，后续扬长避短；通过面试肯定亲身体会到了公司团队文化、面试官体现出来的技术能力、专业性以及职位将来所做的事情，跟自己预期是否有差距，多个 offer 的...
前端html学习记录，可
02-24
本学习记录主要聚焦于HTML的学习，通过三个关键文件——全文对比.html、相似片段.html、综合评估.html，将深入探讨HTML在实际应用中的各种技巧和概念。 首先，我们来看“全文对比.html”。在前端开发中，全文对比...
前端 Flex 布局语法详解
ning的博客
11-10 1120
Flex是Flexible Box的缩写，意为“弹性布局”。它允许容器内的项目（子元素）自动调整大小，以适应不同屏幕尺寸和布局需求。如果需要行内Flex布局，可以使用Flex布局提供了一种强大而灵活的方式来创建响应式布局。通过理解并应用上述属性，你可以轻松地创建出复杂且适应不同屏幕尺寸的布局。随着现代浏览器对Flex布局的广泛支持，它已经成为前端开发中不可或缺的一部分。版权声明：本博客内容为原创，转载请保留原文链接及作者信息。参考文章CSDN - Flex布局详解菜鸟教程 - Flex 布局语法教程。
前端（1）——快速入门HTML
最新发布
m0_63086198的博客
11-14 534
参考： W3school 1. HTML 我使用的是vs code，在使用之前，先安装以下几个插件： Auto Rename Tage HTML CSS Support Live Server 1.1 HTML标签 HTML全称是Hypertext Markup Language(超文本标记语言) HTML通过一系列的标签(也称为元素)来定义文本、图像、链接等等。HTML,标签是由尖括号包围的关键 字。 标签通常成对出现，包括开始标签和结束标签(也称为双标签)，内容位于这两个标签之间，例如
蓝凌OA-EKP hrStaffWebService 任意文件读取漏洞
iSee857的博客
11-12 479
它集成了流程管理、知识管理、会议管理、公文管理、合同管理、费用管控等多个模块，旨在帮助企业解决基础OA应用、系统集成、开发平台和创新业务定制等长期扩展需求，推动企业实现管理在线化、知识赋能化、运营数字化和人机智能化‌。漏洞，未经身份验证攻击者可通过该漏洞读取系统重要文件（如数据库配置文件、系统配置文件）、数据库配置文件等等，导致网站处于极度不安全状态。在处理客户端输入的参数时，进行严格的验证和过滤，防止未授权的文件访问。返回数据经过base64编码 解码后可得读取数据。
Vue中的常用指令
m0_62388400的博客
11-12 1128
指令（Directives）是 Vue 提供的带有的 特殊 标签。为啥要学：提高程序员操作 DOM 的效率。vue 中的指令按照不同的用途可以分为如下 6 大类：内容渲染指令（v-html、v-text）条件渲染指令（v-show、v-if、v-else、v-else-if）事件绑定指令（v-on）属性绑定指令 （v-bind）双向绑定指令（v-model）列表渲染指令（v-for）指令是 vue 开发中最基础、最常用、最简单的知识点。
后端一次性返回数据，前端分页
qq_39307266的博客
11-14 92
vue 结合elementUI 分页组件，后端一次性返回数据，前端做分页。1.template中。js从后端获取总数据。
【前端基础】Javascript取整函数以及向零取整方式
警警的博客
11-11 714
在JavaScript中，有多种方式可以对数字进行取整操作，即去掉小数部分，只保留整数部分。在JavaScript中，有多种方法可以对数字进行取整操作。这些方法各有特点，适用于不同的场景。方法会去掉一个数字的小数部分，返回其整数部分，但不进行四舍五入。在处理数字时，会将操作数转换为32位整数，从而截断小数部分。每种方法都有其适用的场景和限制，选择时需根据具体需求进行权衡。也是一种按位取整的方式，效果与。类似，会截断小数部分。
web前端开发会议记录
06-10
李四分享了一些前端性能优化的经验和技巧，包括减少HTTP请求、压缩和合并文件、使用CDN等。 3. UI设计与开发的协作 王五和张三讨论了UI设计与前端开发之间的协作，他们强调了沟通和合作的重要性，以确保设计与开发...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值