喜欢看网页上那些酷炫的效果吗?这就是CSS的功劳!我整理了一些很棒的CSS特效,让网页看起来更有趣、更生动。这些特效有的简单,有的复杂,但都用的是简单易懂的代码。比如,颜色会慢慢变化的背景,会动的小图标,还有跟着你的鼠标动来动去的效果。这篇文章里,我会和大家分享并展示这些让人看了还想看的CSS特效。 接上次分享的不错的CSS特效1,今天再给大家分享一些不错的css特效! ## 索引 1.列表文字图标 2.动态圆点水波纹 3.呼吸灯效果 4.简约动态按钮 5.输入框选中交互动效 6.Loading动画 7.聚光灯效果 8.文字上下浮动效果 9.汉堡菜单按钮 10.抖动的按钮 11.简约动态输入框 12.搜索框动态特效 13.新拟态输入框 14.多彩动态按钮 15.创意菜单鼠标悬停效果 16.边框流动特效 17.限制显示两行,超出显示... ## 1.列表文字图标 ![IMG_5616.jpeg](https://yjvc.cn/usr/uploads/2024/05/1439036152.jpeg) ```html
喜欢看网页上那些酷炫的效果吗?这就是CSS的功劳!我整理了一些很棒的CSS特效,让网页看起来更有趣、更生动。这些特效有的简单,有的复杂,但都用的是简单易懂的代码。比如,颜色会慢慢变化的背景,会动的小图标,还有跟着你的鼠标动来动去的效果。这篇文章里,我会和大家分享并展示这些让人看了还想看的CSS特效。快来一起看看吧! 相关文章推荐:不错的CSS特效2 ## 索引 1.动态波纹字 2.静态格栅字 3.旋转的金币 4.霓虹灯文字 5.故障字体效果 6.乱码效果 7.输入框交互效果 8.圆点交互按钮 9.文字上下滑动按钮 10.音频特效 11.文字跳动的输入框 12.暗黑模式切换开关 13.呼吸灯按钮 14.新拟态按钮 15.网站底部徽章样式 16.网站LED灯公告 17.HTML滚动播报 ## 1.动态波纹字 ![IMG_5511.gif](https://yjvc.cn/usr/uploads/2024/05/2757241728.gif) ```html 动态的波纹字_刘郎阁
今天给大家分享一个小技巧,给我们的博客文章评论框添加七彩打字动画。这个效果不仅能让我们的博客更加生动有趣,还能提升用户的评论体验,增加互动乐趣。让我们一起来看看如何实现这个效果吧! ## 效果展示 白天模式: ![IMG_5495.gif](https://yjvc.cn/usr/uploads/2024/05/3498388009.gif) 夜晚模式: ![IMG_5496.gif](https://yjvc.cn/usr/uploads/2024/05/3149614578.gif) ## 具体操作 1.复制代码 将以下JS代码复制到主题目录下的 footer.php 文件中 body 标签结束前: ```js (function webpackUniversalModuleDefinition(a,b){if(typeof exports==="object"&&typeof module==="object"){module.exports=b()}else{if(typeof define==="function"&&defin
今天给大家分享一个用JS代码制作一个倒计时公告的小技巧。这个方法非常实用,可以让你博客的公告在特定时间后自动关闭,既方便又高效。让我们一起来看看吧!
之前在使用joe主题的时候,偶然发现一个非常有趣的小组件“旋转小人”。因自己折腾切换主题,很多东西都没有了,今天在逛原来的网站时,又发现了这个项目。一段简单的代码,就能实现"旋转小人"的效果,现在分享给大家。 ## 效果展示 ![IMG_5152.gif](https://yjvc.cn/usr/uploads/2024/04/670869841.gif) 效果图有点拉胯,将就看吧。 ## 代码 ```html 旋转小人 刘郎阁 .twopeople{ margin: 0; align-items: center; justify-content: center; text-align: center; } canvas { displa
接上次分享的"有趣可调节的暗黑模式"文章,今天再给大家分享一个挺不错的白天夜晚模式自由切换的小组件。 老样子,如果喜欢可以直接拿去食用😎!
暗黑模式,就是把你手机或电脑上的界面,从原来的亮色变成深色。这样在晚上或者光线暗的地方用手机时,屏幕就不会那么刺眼,对眼睛比较好。现在很多应用和系统都有了这个功能,用起来挺方便的。 今天给大家分享一个可玩性极高的暗黑模式自由调节代码。至于用到什么地方,怎么用,你说了算😎 ## 效果展示 ![IMG_5048.gif](https://yjvc.cn/usr/uploads/2024/04/1676431432.gif) 此效果展示图来自jdeal。 ## 代码 ```html 暗黑模式 刘郎阁 点我💡 document.addEventListener('DOMContentLoaded', function () { const lightControlButton = document.getElementById('light-control'); let currentOpacity = 0.1; let isLightControlActive = fals
HTML打字机效果是一种在网页上模拟打字机打字效果的技术,通过在HTML中使用JavaScript和CSS实现。当用户访问网页时,文字会像打字机一样一个一个地出现,给人一种动态的视觉效果。这种效果可以增加网页的趣味性和吸引力,提高用户体验。 ## 方法1 ### 效果展示 ![tutieshi_640x189_16s 2.gif](https://yjvc.cn/usr/uploads/2024/04/621779844.gif) ### 具体操作 1.添加html代码 ```html 刘郎阁 ``` 2.引入css样式代码 ```css .daziji{ height: 120px; line-height: 120px; text-align: center; position: relative; font-size: 50px; letter-spacing: .2em; } .daziji h2{ margin: 50px 0 20
GIF屏幕录制工具能捕捉电脑屏幕活动,将其转化为GIF动画。通过设置参数如录制区域、帧率和画质,用户可以轻松制作出高质量的GIF动画,并将其分享到社交媒体或其他平台。 今天看到一款操作简单、小巧、运行流畅、而且免费的 Gif 屏幕录制软件,分享给大家。 ## 效果展示 ![1.gif](https://yjvc.cn/usr/uploads/2024/03/3609058729.gif) ## 工具简述 ![2.gif](https://yjvc.cn/usr/uploads/2024/03/823317058.gif) 立即下载 GifCam 是一款小巧[屏幕录制工具],像一个摄像头一样在所有窗口上置顶,这样就可以任意移动它并调整它的大小来录制你想要的区域内容。 录制完成后直接输出为 Gif 格式,并且支持单帧录制,帧率支持 10FPS、16FPS、30FPS,全屏录制和区域录制均可实现,录制完成后还支持简单的编辑。 ## 功能特性 1.小巧实用,性能优异。通过极致的算法保证输出的 gif 动图流畅且小巧 2.提供了使用简
当心灵无助地漂泊在伤痛的深渊中,那种难以言喻的伤心和难过如潮水般席卷而来。仿佛被困在无边无际的黑暗中,找不到一丝希望和出口,只剩下彻骨的孤独和失落。每一次的呼吸都像是在悲伤中挣扎,每一颗心跳都传递着无声的哀伤。在绝望的边缘徘徊,无法找到一丝安慰和慰藉,只能默默承受内心的苦楚和煎熬…… [x-audio src="http://music.163.com/song/media/outer/url?id=2014560893.mp3" type="audio/mpeg" autoplay="auto"/] > 打开音乐,跟随文案进入这该死的气氛中吧!😂😂 ![2024-03-27T07:24:30.png](https://yjvc.cn/usr/uploads/2024/03/3454530826.png) ![2024-03-27T07:24:40.png](https://yjvc.cn/usr/uploads/2024/03/1663607980.png) 以上这两张图只是部分截图,这个源码的最终效果是类似"视频"的GIF动图。 ## 源码
刘郎 ( 博主4小时前在线 )
敬畏生命,热爱生活!