Loading

文章分类 -  Css

网站logo css亮光扫过特效
摘要：在图片上出现白光条并划过，无限循环的模式 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" 阅读全文
posted @ 2024-05-19 12:03 Carvers 阅读(46) 评论(0) 推荐(0)
css实现重复渐变的边框
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> .container { padding: 10px; background: #fff; } .card { width: 阅读全文
posted @ 2023-09-10 16:02 Carvers 阅读(38) 评论(0) 推荐(0)
css实现文字交融效果
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> .container { text-align: center; filter: contrast(50); backgro 阅读全文
posted @ 2023-09-10 15:32 Carvers 阅读(42) 评论(0) 推荐(0)
css实现背景视频文字
摘要：代码实现如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> .txt { font-size: 40px; position: absolute; inset: 0; 阅读全文
posted @ 2023-08-17 23:29 Carvers 阅读(59) 评论(0) 推荐(0)
css实现圆形放大的hover效果
摘要：代码实现如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> .avatar { background: url("https://gimg2.baidu.com/ima 阅读全文
posted @ 2023-08-17 23:10 Carvers 阅读(62) 评论(0) 推荐(0)
css实现立体文字效果
摘要：代码实现如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> span { text-shadow: -1px 1px #bbb, -2px 2px #bbb, -3px 阅读全文
posted @ 2023-08-17 22:53 Carvers 阅读(327) 评论(0) 推荐(0)
css实现文字连续光影特效
摘要：代码实现如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Carver玩转css</title> <style> span { color: #0099FF; font-family: "Century Gothic", 阅读全文
posted @ 2023-08-17 22:40 Carvers 阅读(115) 评论(0) 推荐(0)
CSS多种方式实现元素水平垂直居中
摘要：html结构: <div class="center">确定宽高水平垂直居中</div> <div class="center2">不确定宽高水平垂直居中</div> <div class="center3">确定宽高水平垂直居中2</div> <div class="center4"><span> 阅读全文
posted @ 2022-08-28 17:51 Carvers 阅读(32) 评论(0) 推荐(0)