深圳幻海软件技术有限公司 欢迎您!

  • CSS 清除浮动

    在元素设置浮动(float)后,该元素就会脱离文档流,并且向左或向右浮动,直至它的外边缘遇到包含框或者另一个浮动框的边缘。一、浮动元素对布局的影响1.1、浮动元素造成父元素的高度塌陷:原来的父元素高度是内部元素撑开的,但是当内部元素浮动后,脱离文档流浮动起来,那父元素的高度就坍塌,变为高度0px。&

  • 居中布局:水平居中和垂直居中

    居中布局在实际场景中很常见,在面试当中也经常会被考察。以下分别是水平居中和垂直居中常用的样式。水平居中margin:0auto;+width应用于块级元素居于容器中间若节点不是块级元素,需声明display:block若节点宽度已隐式声明则无需显式声明width<divclass="h-c1"

  • 我的Vue之旅 11 Vuex 实现购物车

    VueCartView.vuescript数组的filter函数需要return显式返回布尔值,该方法得到一个新数组。使用Vuexstore的modules方式,注意读取状态的方式this.$store.state.cart.items刷新页面后state状态还原,需要用session保存状态(TO

  • 学习笔记——Vue条件渲染

    2022-10-27 一、Vue的列表渲染(1)关键字:v-for(2)用法:v-for:"临时变量名in列表名"。“列表”的说明是写在script中的Vue中的data中。(3)扩展:在列表渲染中,渲染就是在前端能看见的。需要用到索引的用法。v-for:"(临时变量名,index)in列

  • flex常用布局

    公共样式:<style>*{margin:0;padding:0;}.has-flex{display:flex;}</style> 垂直居中子元素左右分布css.father-one{width:100%;height:200px;background-color

  • 由 transform 被占用引发的思考

    一、transform很容易被占用众所周知,CSS 中的transform是一个包含很多值的属性,例如:复制div{transform:translate(-50%,-50%)scale(1.5)}1.2.3.但是,这并不是简写,而是就该这么写,这一点和background不一样。复制di

  • 前端框架:性能与灵活性的取舍

    大家好,我卡颂。针对「前端框架」,长期存在着各种纷争。其中争论比较大的是下面两项:性能之争API设计之争比如,各大新兴框架都会掏出benchmark​证明自己优秀的运行时性能,在这些benchmark中React通常是垫底的存在。在API​设计上,Vue爱好者认为:“更多的API约束了开发者,不会因

  • 妙不可言!纯 CSS 实现拼图游戏

    本文,将向大家介绍一种将多个CSS技巧运用到极致的技巧,利用纯CSS实现拼图游戏。本技巧源自于 TemaniAfif[1] 的CodePen CSSOnlyPuzzlegame[2]。一款完全由CSS实现的拼图游戏。我们要做的,就是将散落的图片碎块,复原成一幅完整的图,

  • 有 React fiber,为什么没有 Vue fiber?

    提到reactfiber,大部分人都知道这是一个react新特性,看过一些网上的文章,大概能说出“纤程”“一种新的数据结构”“更新时调度机制”等关键词。但如果被问:有reactfiber,为什么不需要vuefiber呢;之前递归遍历虚拟dom树被打断就得从头开始,为什么有了reactfiber就能断

  • 想知道Vue3与Vue2的区别?五千字教程助你快速上手Vue3!

    从Vue3发布以来,我就一直对其非常感兴趣,就一直想着将其投入公司的生产中,但是开始考虑到很多不确定性就暂时对一些很小的功能进行一些尝试;慢慢的发现组合式Api的形式非常适合开发(个人感觉),尤其是Vue3.2推出了setup语法糖后直呼真香。后面公司的新项目几乎全部采用了Vue3了。使用Vue3开

  • 冷知识!使用 Display: Contents 实现幽灵节点?

    ​​display:contents​​ 是一个比较陌生的属性,虽然属于display这个基本上是最常见的CSS属性,但是 ​​contents​​ 这个取值基本不会用到。但是它早在2016年就已经得到了Firefox的支持。本文将深入一下这个有意思的属性值。基本用法根

  • 前端实现右键自定义菜单

    大家好,我是前端西瓜哥。本文将讲解Web页面如何实现自定义菜单功能。线上demo:https://codepen.io/F-star/pen/WNOvQVQ。思路核心思路是:注册contextmenu事件,取消该事件的默认行为,然后通过event对象拿到光标相对视口的坐标位置(event.clien

  • 浅谈逻辑选择器 Is、Where、Not、Has

    在CSS选择器家族中,新增这样一类比较新的选择器--逻辑选择器,目前共有4名成员::is:where:not:has本文将带领大家了解、深入它们。做到学以致用,写出更现代化的选择器。:is伪类选择器:is()CSS伪类函数将选择器列表作为参数,并选择该列表中任意一个选择器可以选择的元素。在之前,对于

  • React 状态管理 - useState/useReducer + useContext 实现全局状态管理

    useReducer是useState的替代方案,用来处理复杂的状态或逻辑。当与其它Hooks(useContext)结合使用,有时也是一个好的选择,不需要引入一些第三方状态管理库,例如Redux、Mobx。目标在本文结束时,您将了解:ContextAPI的使用。在哪些场景下可以使用Context而

  • 容易忽视的Flex属性Align-Content

    本文转载自微信公众号「微医大前端技术」,作者鄢栋。转载本文请联系微医大前端技术公众号。背景近期做项目,写页面的css写的太多了,基本上都要用到flex布局,而我所用到的flex布局中的属性很有限,基本只会用到flex-direction,justify-content,align-items这三个容

  • 前端架构师成长之路:分享 6 个实用的 Vue 技巧

     Vue已经成为很多公司前端项目的首选框架,而要成为一个会用Vue的开发者并不需要花太多时间和精力去学习大的概念,但作为成为一个更高级的开发者就需要去深入框架和基础知识的学习。本文跟分享几个在Vue项目开发中可以用到的小技巧。1.使用prop限制属性列表Vue让自定义组件变得容易,在自定义

  • 新手React开发人员容易做错的5件事

    请勿执行的操作以及如何解决的方法,这部分内容是针对React的新手开发人员提供的。1.忘记大写React组件考虑一下这段代码,它创建一个简单的div,其中包含父组件的标题。里面有一个子组件,其中包含带有一些文本的div。复制class childComponent extends

  • 微前端qiankun项目实践

    导语最近在做微前端的项目,过程中真是踩了不少坑,在有限的资料中不断试错,默默无语两行泪哈哈. 在此次将踩坑部分都记录下来,让更多的人少走点弯路,  此项目使用蚂蚁金服qiankun为基础作为开发.话不多说开讲!!!那什么是qiankun呢qiankun是一个基于sing

  • 10个CSS高频面试题,你都会吗?

    一.什么是BFC机制BFC(BlockFormattingContext),块级格式化上下文,是一个独立的渲染区域,让处于BFC内部的元素与外部的元素相互隔离,使内外元素的定位不会相互影响。 触发条件(以下任意一条) float的值不为none overflow的值不为

  • 坚实的React基础:初学者指南

    在过去的几个月里,我一直在使用React和React-Native。我已经发布了两个作为产品的应用, KivenAa(React)和 PollenChat(ReactNative)。当我开始学习React时,我找了一些不仅仅是教我如何用React写应用的东西(一个博客,一个视频,

推荐阅读