小马SEO:气泡提示源码冒泡提醒弹窗动画

HTML:
i
Hi!
我这里是气泡提示的内容
css样式:
body {
background: #DCF5FF;
margin: 0;
height: 100vh;
display: grid;
justify-items: center;
align-items: center;
font-family: 'Nunito', 'sans-serif';
}
.inner {
background: #e8c827;
padding: 1em;
border-radius: 10px;
width: 250px;
clip-path: circle(10% at 90% 20%);
transition: all .5s ease-in-out;
cursor: pointer;
}
.inner:hover {
clip-path: circle(75%);
background: #00B6FF;
}
.inner h1 {
color: white;
margin: 0;
}
.inner p {
color: white;
font-size: .8rem;
}
.inner span {
float: right;
color: white;
font-weight: bold;
transition: color .5s;
position: relative;
margin-right: 4%;
line-height:12px;
font-size:24px;
}
.inner:hover span {
color: rgba(255, 255, 255, 0);
}
本文地址:https://www.henenseo.com/archives/1448
关注我们:请关注一下我们的微信公众号:扫描二维码
,公众号:xinqidian129
版权声明:本文为原创文章,版权归 新起点博客 所有,欢迎分享本文,转载请保留出处!
关注我们:请关注一下我们的微信公众号:扫描二维码

版权声明:本文为原创文章,版权归 新起点博客 所有,欢迎分享本文,转载请保留出处!