2021 年 5月随笔档案 - jimyking

css边框样式（动画）

摘要：html： <div class="wrap"> <a href="#">shui</a> </div> css： body { display: -webkit-box; display: flex; flex-wrap: wrap; justify-content: center; align- 阅读全文

posted @ 2021-05-12 15:31 jimyking 阅读(121) 评论(0) 推荐(0)

css文字动画（自动换文字）

摘要：html： <div class="content"> <div class="content__container"> <p class="content__container__text"> 酒之 </p> <ul class="content__container__list"> <li cl 阅读全文

posted @ 2021-05-11 09:31 jimyking 阅读(544) 评论(0) 推荐(0)

css实现文字过度变色效果

摘要：html： <div class="news text-center"> <a href="#"> <span>新</span> <span>闻</span> <span>中</span> <span>心</span> </a> </div> css： .news { font-size: 40px 阅读全文

posted @ 2021-05-09 10:29 jimyking 阅读(622) 评论(0) 推荐(0)

js实现页面下拉，区块（文字，图片等）左右淡入淡出效果

摘要：html： <div class="box"> <span class="historybox"> </span> </div> <div class="box"> <span class="historybox1"> </span> </div> css： <style type="text/cs 阅读全文

posted @ 2021-05-06 14:26 jimyking 阅读(427) 评论(0) 推荐(0)

css + js 实现文字分割动画

摘要：欲实现如下的文字分割效果： html部分代码如下：悠酒网 css部分代码如下： body { height: 100%; background: white; } h1 { color: black; text-align: center; font-size: 10vw; position: r 阅读全文

posted @ 2021-05-03 15:31 jimyking 阅读(203) 评论(0) 推荐(0)

js实现返回顶部按钮

摘要：html： <div class="box"></div> <div class="box1"></div> <div id="btn"> <img src="img/return.png" width="50px"height="40px"> </div> css： .box { width: 1 阅读全文

posted @ 2021-05-02 23:24 jimyking 阅读(96) 评论(0) 推荐(0)

css实现毛玻璃效果

摘要：html：<div class="card"> </div> css： .card { position: relative; height: 270px; width: 450px; border-radius: 25px; background: rgba(255, 255, 255, 0.2) 阅读全文

posted @ 2021-05-02 15:25 jimyking 阅读(319) 评论(0) 推荐(0)