![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 56
老电影故事
我只想搞搞搞搞搞搞搞钱!
展开
-
听说还有人不知道如何实现水平垂直居中?
【代码】听说还有人不知道如何实现水平垂直居中?原创 2023-11-26 12:06:28 · 467 阅读 · 0 评论 -
逐帧动画demo
* steps(1) 是一种特定的时间函数,它表示动画将在每个关键帧之间离散地切换,就像一步一步前进一样。steps(1) 是一种特定的时间函数,它表示动画将在每个关键帧之间离散地切换,就像一步一步前进一样。/* 动画会在每个关键帧之间立即切换,而不会经过过渡动画 */动画会在每个关键帧之间立即切换,而不会经过过渡动画。用这一张图实现一个在跑的猎豹的动画。原创 2023-11-14 07:00:00 · 315 阅读 · 0 评论 -
纯 CSS 实现几个 Loading 效果
radial-gradient 画出水平面的波动,就三个圆。var(–r1) 直接调用定义好的属性值。看了这么多骚操作,你学废了吗?反正我是没学明白 😥😥😥😥。原创 2023-04-26 08:30:00 · 907 阅读 · 0 评论 -
CSS画几种图形的方法
clip-path CSS 属性可以创建一个只有元素的部分区域可以显示的剪切区域。区域内的部分显示,区域外的隐藏。剪切区域是被引用内嵌的 URL 定义的路径或者外部 SVG 的路径。使用 border 实现三角形应该是大部分人都掌握的,也是各种面经中经常出现的,利用了高宽为零的容器及透明的 border 实现。使用伪元素在一个正方形的元素上创建一个完全重叠的圆形,并使用transform属性将其缩小到所需大小。将一个正方形的元素的border-radius属性设置为50%即可将其变为一个圆形。原创 2023-04-01 07:00:00 · 1001 阅读 · 1 评论 -
js来控制、修改CSS伪元素的方法
添加字符串使用引号包括一段字符串,将会向元素内容中添加字符串。}}}原创 2022-10-31 15:50:30 · 5580 阅读 · 1 评论 -
饿了么input输入框设置type=‘number‘时,去掉后面的上下按钮
BUT在现在项目中,使用的是vue+element,通常写当前页面的样式时使用scoped,但是这样会发现上面的代码失效,此时需要使用/deep/当inputtype=‘number’时,去掉后面的上下按钮。在style里面添加此段代码即可。...原创 2022-07-27 11:05:38 · 2625 阅读 · 0 评论 -
分享一个好玩的JS小游戏
一个js的忍者小游戏话不多说如图所示简单好玩 打发时间HTMLCSS赶紧跑起来试试吧!!!!原创 2022-07-19 09:16:42 · 2520 阅读 · 4 评论 -
缩短饿了么tabs 组件线条宽度
css样式很多,相互之间配合起来其实能完成很不错的效果,也能减少很多JavaScript代码。因为对样式理解少从而造成的JavsScript脚本增多是得不偿失的。这么多方式都能达到你觉得做不到的效果,以上只是用elementUI的tabs组件做的例子,其他插件只需要用同样的方法去做,也能达到效果,很多时候,多多考虑样式之间的配搭,能极大提高你代码的稳定与码代码的效率。好了,上面分享就这么多,希望能帮到你哦httpshttpshttpshttpshttpshttps。...原创 2022-07-15 11:13:13 · 1916 阅读 · 0 评论 -
echarts实现tooltip内容可移入选中复制
今天改测试提的一个优化,在我们使用echart统计图关系图的时候,鼠标移入某个点显示tooltip气泡信息。那么问题来了,测试说她需要对气泡内容选中复制,可是默认是无法选中复制的,所以我就想啊想,查啊查,改啊改,话不多说,直接上干货!其实很简单哈哈哈哈哈哈哈哈哈哈CSS控制js控制...原创 2022-07-14 10:24:10 · 2353 阅读 · 0 评论 -
前端实现好看的动态时钟效果
HTMLCSSJS原创 2022-07-13 07:00:00 · 950 阅读 · 0 评论 -
纯css实现文字图片的效果
纯CSS实现文字图片效果原创 2022-07-12 09:36:44 · 333 阅读 · 0 评论 -
解决element的tabs组件出现蓝色框的问题
今天写搬砖的时候,用的是饿了么的tabs组件,但是它有时会在选中那里出现一个蓝色的框大概这个样子我说话从不拐弯抹角但是 话说回来怎么解决啊请往下看原创 2022-06-13 17:50:00 · 712 阅读 · 2 评论 -
CSS文本设置超出2行显示省略号
如图所示,当居住地址字段太长超过2行时就显示 (…)2、强制2行或多行就要用到CSS3原创 2022-06-10 08:30:00 · 62779 阅读 · 4 评论 -
CSS实现毛玻璃效果
CSS毛玻璃效果,直接上代码,别墨迹HTML原创 2022-06-09 09:32:20 · 158 阅读 · 0 评论 -
拿来就能用的网页动画特效,不来看看?
写在前面我特别喜欢收集前端好看的特效代码,前端好用的网站。今天给大家分享出来,如果觉得有帮助可以点赞收藏支持一下,如果能关注一下就再好不过了ヾ(≧▽≦*)o,之后还会分享许多干货,话不多说,上动图:哎呀 没有动图 你还是自己跑下不说了上代码!!!!HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-C原创 2022-05-26 10:31:34 · 390 阅读 · 0 评论 -
纯css实现好看的加载动画loading
如图所示直接上干货html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <ti..原创 2022-04-08 18:45:00 · 314 阅读 · 0 评论 -
CSS定位详解
一、CSS positionCSS position属性用于指定一个元素在文档中的定位方式,定位分为静态定位,相对定位,绝对定位,固定定位、粘性定位这五种其中top、right、bottom、left和z-index属性则决定了该元素的最终位置。二、静态定位(static)一般的标签元素不加任何定位属性都属于静态定位,在页面的最底层属于标准流。1、对边偏移无效。2、一般用来清除定位的3、一个有定位的盒子不想再有定位了,加上 position:static;就可以了三、相对定位(relati原创 2021-11-25 00:08:58 · 4801 阅读 · 0 评论 -
CSS清除浮动的方法
一、clear属性适合上下关系的标签清除浮动<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>.原创 2021-11-24 09:00:00 · 211 阅读 · 0 评论 -
解决子元素设置margin-top,效果到父元素上的问题
一、问题在实战中发现子级在父级中设置margin-top的时候,会失效,而会附加在父级上,相信大家也会遇到过这种情况,那这是怎么回事呢?要如何解决呢?那么我们看一下例子吧:<body> <div> <p></p> </div></body>*{margin:0;padding:0}/*父元素*/div{ width:400px; height:400px; backg原创 2021-11-17 23:51:59 · 713 阅读 · 0 评论 -
reset.css初始化CSS
@charset "utf-8";/*Reset CSS作用:清除和重置 基础css样式*//* 一、重置*/html { overflow-y: scroll; }/* 让非ie浏览器默认也显示垂直滚动条,防止因滚动条引起的闪烁 */body,div,p,span,a,img,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,table,thead,tbody,tr,td,th{ padding: 0; margin: 0;}bod原创 2021-11-08 23:12:17 · 563 阅读 · 0 评论