css
文章平均质量分 60
DevilAngelia
学无止境
展开
-
CSS 过渡、动画
hover过渡效果 圆圈内收缩<style> html { --size: 1.5rem; --color: #5fa04e; } .box { display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh; } .hovers {原创 2022-05-06 10:01:13 · 111 阅读 · 0 评论 -
jquery鼠标移动、点击页面出现爱心
爱心1、css画一个爱心.main{ width: 20px; position: fixed;}// 圆形一.disc1{ width: 20px; height: 20px; border-radius: 100%; /*background: red;*/ position: absolute; top: 0; left: 0; z-index: 2;}// 圆形二.disc2{ width: 20原创 2021-08-24 17:20:08 · 438 阅读 · 0 评论 -
ColorUI 使用文档
ColorUI 简易 使用文档友情链接文本大小颜色图片头像边距布局列表友情链接ColorUI使用文档看云: https://www.kancloud.cn/als24/color/1141392ColorUI H5H5: http://demo.color-ui.com/h5.html#/原文链接简书: https://www.jianshu.com/p/450527d7239a#comments文本大小xssmdflgxlxxlslxsl原创 2021-08-06 11:03:10 · 9397 阅读 · 0 评论 -
CSS 计数器 九宫格 超出9个显示多出的数量
一、CSS 计数器counter-reset - 创建或者重置计数器counter-increment - 递增变量content - 插入生成的内容counter() 或 counters() 函数 - 将计数器的值添加到元素使用在元素父级创建一个计数器.list { counter-reset: count;}子级中使用伪类显示数量.item::after { counter-increment: count;}二、实践先预览一下吧CSS代码* {原创 2021-07-14 16:18:49 · 279 阅读 · 0 评论 -
表单滑动验证
滑动验证效果—↓↓↓滑动前滑动中滑动完成代码<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>滑动验证</title> <link rel="stylesheet" type原创 2021-06-18 11:50:18 · 190 阅读 · 0 评论 -
纯CSS 3D旋转立体画册 第一弹
纯CSS 3D旋转立体画册 第一弹效果外层盒子+动画效果盒子鼠标移入HTML<div class="content flex col-center row-center"> <div class="hover"> <!-- 立方体三维图片展示 --> <div class="box"> <div class="item"></div> <div class="item"></di原创 2021-06-17 18:23:31 · 203 阅读 · 0 评论 -
JavaScript CSS 线性进度条
JS CSS 进度条html<div id="show" class="show"> <div class="box"> <div class="line-box" id="line_box"> <div class="line" id="line"></div> </div> <div id="num" class="num">0%<原创 2020-12-26 16:04:04 · 272 阅读 · 1 评论