×

spring boot

Vue复刻华为官网 (一)(华为VUE)

luxun luxun 发表于2024-05-11 浏览5718 评论0
1 分析 根据华为网页的布局,我们大体上可以将其划分为7个盒子,如下,由于写一个这样的网页再加上部分动态效果,需要的时间很长,本篇博客只记录了div1、div2、div3的静态效果+轮播图的实现。 2 顶部盒子的实现 想要实现的正是最上部那个黑色的圆框 2.1 思路 我的思路很简单,用四个盒子,其中最大的盒子也就是整个黑色框,大盒子里面包裹着小盒子,每个小盒子对应一个字段(集团网站、选择区域/语言、登录),排版布局,则需要三个小盒子,依次向左浮动(float:left

JavaScript教程

【Vue】悬浮窗和聚焦登录组件经验总结(vue 悬浮窗)

dede58织梦模板 dede58织梦模板 发表于2024-05-11 浏览4663 评论0
前言 ​ 本文整理了实现悬浮窗以及聚焦登录组件的功能。 ​ 为的是方便大家和自己的学习。 ​ 省流:可以只看1.2 和 2的代码即可 1 悬浮窗 现在各大流行视频网站的平台都在使用这种悬浮显示的效果,我就想这种东西是怎样搞出来的呢!几经尝试,终于找到了一个实现方式,记录一下自己的开发历程,方便以后的使用,也为了各C友提供便利。 1.1 使用display 尝试用display实现,利用display:none和block的切换,来实现悬浮窗的显示/关闭。 把方法加在di

html5教程

继承的简单了解(继承的简单了解是什么)

朱朱朱、 朱朱朱、 发表于2024-05-11 浏览4889 评论0
🎃前言 虽然平时在写代码的时候比较少用的继承,因为JS首先应该是类似于动态的,不像其他语言一样,它没有提供一个Class的实现,只是在ES2015/ES6中通过引入Class关键字语法糖而已,由于是基于原型的继承,所以继承是面试会重点考察的一部分,继承在很大程度上是比较考验到对面向对象的一个熟悉程度,关于JS的继承中有几大种方式,那么今天通过这篇文章就把自己了解到的继承方式展开一下学习。 🎆什么是继承 继承可以是一个简单的父子关系,比如‘B继承了A,那么B就相当于是A的子类,A就是B的

scala

Vue复刻华为官网 (二)

Zni Zni 发表于2024-05-11 浏览5405 评论0
1 推荐信息 1.1 思路 看了这个gif后,可以清楚的看到产生了三个动画效果:图片"拉近","了解更多"从下往上显示出来,阴影。 我看了华为官网的源代码,发现图片本身就是有一个mask的,这样能让图片看起来暗一些,也就意味着,当鼠标进入的时候,只需要让mask的背景颜色更深一些,就实现了阴影的效果。至于图片"拉近",我早就写过了,无非是把图片放大,然后超出盒子的不显示,这个也容易。但了解更多显现,难度就大了一些。我想了很久,最后只有通过位置,来把"了解更多"显示出来,

JavaScript教程

【Vue】Axios详解

dede58织梦模板 dede58织梦模板 发表于2024-05-11 浏览7488 评论0
1 Axios简介 1.1 什么是Axios? Axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http 模块, 而在客户端 (浏览端) 则使用 XMLHttpRequests。 1.2 Axios的特性 从浏览器创建 XMLHttpRequests 从 node.js 创建 http 请求 支持