29.CSS边框动画特效

最新推荐文章于 2024-06-20 00:04:40 发布

@大迁世界

最新推荐文章于 2024-06-20 00:04:40 发布

阅读量161

点赞数

分类专栏： CSS特效案例文章标签： css 前端

本文链接：https://blog.csdn.net/qq449245884/article/details/133152474

版权

CSS特效案例专栏收录该内容

40 篇文章 10 订阅 ¥9.90 ¥99.00

订阅专栏

超级会员免费看

效果

在这里插入图片描述

源码

index.html

<!DOCTYPE html>
<html>
<head>
<title>Quick CSS Border Trick</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div class="box">
		<span></span>
		<h2>01</h2>
	</div>
</body>
</html>

css

@import url('https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900');
*
{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Poppins', sans-serif;
}
body
{
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
	background: #0c1022;
}
.box
{
	positi

了解本专栏