CSS
文章平均质量分 94
分享CSS基础知识及案例
Amo Xiang
让优秀成为一种习惯
展开
-
SVG 基础教程
目录一、SVG 基础二、绘制图形2.1 绘制矩形2.2 绘制圆形2.3 绘制椭圆2.4 绘制多边形2.5 绘制直线2.6 绘制曲线2.7 绘制路径2.8 绘制文本三、SVG 中的滤镜3.1 SVG 滤镜类型3.2 SVG 实现马赛克效果四、SVG 实现动画五、SVG 中的渐变5.1 线性渐变5.2 径向渐变最近笔者在抓取数据的时候,遇到了 SVG 反爬,故找了一份 SVG 学习笔记,本文用于记录 SVG 学习过程中的知识点。一、SVG 基础SVG 指可伸缩矢量图形,是定义用于网络的基于矢量的图形,并且原创 2021-11-09 14:30:36 · 1141 阅读 · 4 评论 -
肝了两宿才收集的17个超炫酷的 CSS 动画加载与进度条特效,绝对值得收藏!!!
文章目录一、圆形加载动画二、上下跳动的圆球加载动画三、3D立体加载动画四、饼图加载动画五、多色圆点波动效果的加载动画六、制作顺时针放大的圆圈加载动画七、制作小圆圈轮流放大的加载动画八、制作竖条加载动画九、制作水波扩散效果加载动画十、制作逆时针逐渐放大多点加载动画十一、制作形状变化的加载动画十二、实现动态前进的阴影进度条十三、椭圆形进度条加载十四、彩色进度条加载效果十五、环形加载动画十六、制作斑马线样式的进度条十七、程序加载页面一、圆形加载动画1、实例描述:浏览网页时,难免会有网页加载慢的情况,当网页长时原创 2021-06-23 01:41:54 · 17818 阅读 · 6 评论 -
肝了一宿才收集的48个超炫酷的 CSS 文字特效,绝对值得收藏!!!
文章目录一、实现线性渐变的文字二、制作文字阴影效果三、制作文字模糊发散效果四、制作3D立体文字五、以两种不同颜色显示文字六、制作镂空文字七、实现文字的图案填充效果八、模拟古诗垂直显示文本九、实现文字的倾斜效果十、实现文字的荧光闪烁效果十一、实现文字的舞台灯光效果十二、制作发光文字十三、实现立体旋转的文字十四、文字翻转动画效果十五、实现火焰文字十六、实现文字的闪烁效果十七、上下摇摆的文字动画效果十八、制作跳跃的文字动画十九、实现文字水纹效果二十、实现文字水平往复循环滚动二十一、使用SVG创建空心虚线线条文字二原创 2021-06-20 11:24:14 · 62480 阅读 · 55 评论 -
CSS3-弹性布局
CSS3-弹性布局弹性布局(伸缩布局)给容器设置的样式flex-directionjustify-contentflex-wrapalign-itemsalign-contentflex-flow示例代码1:flex参数详解示例代码2:flex换行问题给子元素设置的样式orderflex-growflex-shrinkflex-basisflexalign-self示例代码:flex布局给子元素设...原创 2020-04-25 00:28:33 · 1590 阅读 · 0 评论