
其他(html/css...)
文章平均质量分 62
halo1416
一个迷茫的前端攻城狮
展开
-
linear-gradient 实现切角效果
一、前言linear-gradient() :函数用于创建一个表示两种或多种颜色线性渐变的图片。即实现线性渐变!二、基础用法默认渐变方向是从上到下渐变,这种情况不需要申明渐变方向!/* 1. 从上到下, 从红色开始,转为黄色,再到蓝色*/#grad { background-image: linear-gradient(red, yellow, blue);}/* 2. 从左到右,从红色开始,转为黄色 */#grad { background-image: linear-gra原创 2022-03-30 14:12:00 · 789 阅读 · 0 评论 -
css实现波纹扩散效果
一、实现效果二、实现代码<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-casle=1.0,user-scalable=no" /> <title>圆点扩散</title> <style type="text/css">原创 2022-02-10 10:32:33 · 4832 阅读 · 0 评论 -
基于Animate.css和 jquery-aniview 做动画
一、前言就我个人而言,我的项目经验大多在SPA应用,小程序这方面。但在前不久,接到了一个官网的需求,页面简单并且不多,要求就是要做SEO,页面做有简单的交互动画。二、技术选型目前我们公司的技术栈都是vue,但vue对于SEO是不太友好的,除非使用SSR,但里面还有做大量的简单动画。不怎么推荐!这样简单并且页面较少的项目,而且需要SEO和页面中有大量简单的动画,最适合用 html + css + jquery 来完成。并且搭配 Animate.css 和 jquery-aniview 来完成动画需求。原创 2021-03-01 15:18:49 · 403 阅读 · 0 评论 -
使用div模拟输入框
1.<div class="divInput" contenteditable="true" @input='contentChange'></div>2.contentChange(event){ this.inputContent = event.target.innerText},注意: 使用 contentedit...原创 2019-07-18 16:18:21 · 1119 阅读 · 0 评论 -
font-face使用
@font-face 是 CSS3 的一个模块,其主要作用是可将自定义字体嵌入到网页中,让网页字体的运用不只是限定在 Web 安全字体中更多精彩更多技术博客,请移步 asing1elife's blog语法webFontName: 引入的自定义字体名称,将会为指定的元素添加 font-family: webFontNamesource: 字体路径...转载 2019-08-19 18:34:17 · 373 阅读 · 0 评论