Loading... > 之前的导航页视觉疲劳了,新做了一个渐变式的,为方便大家,去掉所有本地依赖,全部资源 在线引入,就一个单页`HTML`,随便放在哪个地方都可以,您也可以自己动手个性化,分享给大家,谢谢点赞。 ## 演示 http://itggg.cn ## 功能 - 响应式设计,设备自适应 - 获取访客IP - 调用一言或今日诗词 - font-awesome 图标支持 ## 配置 <div class="tip inlineBlock info"> **标题,改成你自己的** </div> ```html <!-- 大标题名称 --> <h1>NULL H1</h1> <!-- 小标题一句话介绍 --> <h5>NULL H5</h5> ``` <div class="tip inlineBlock info"> **页面名称,改成你的内容** </div> ```html <!-- SEO名称/页面名称 --> <title>NULL</title> ``` <div class="tip inlineBlock info"> **3、ico图标,改成你的页面 ico** </div> ```html <!-- 页面ico图标 --> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> ``` <div class="tip inlineBlock info"> **4、一言和今日诗词二选一,默认一言,要使用诗词,去掉诗词注释,并把一言注释掉即可** </div> ```html <!-- 一言 --> <p id="hitokoto_text">em...</p> <!-- 今日诗词 --> <!-- <img src="https://v2.jinrishici.com/one.svg?font-size=30&spacing=2&color=Gainsboro"> --> ``` <div class="tip inlineBlock info"> **5、导航按钮,按格式添加即可,默认自带4个,修改链接和名称,要添加格式如下,不要超出`<p>`标签** </div> ```html <!-- 导航按钮 --> <a href=" ">NULL</a> | ``` <div class="tip inlineBlock info"> **6、图标按钮,默认3个,更多按格式添加即可,一行一个,样式参考:**[图标样式](http://www.fontawesome.com.cn/faicons/) </div> ```html <!-- 图标按钮 --> <li><a href=" " class="fa fa-qq fa-2x"><span class="label"></span></a></li> ``` <div class="tip inlineBlock info"> **7、渐变背景图片和颜色设置,默认使用必应每日一图,您也可以改成你直接的图片,替换链接即可,颜色可参考:**[中国传统颜色](http://zhongguose.com/) </div> ```js <!-- 渐变背景初始化 --> source: 'https://api.itggg.cn/c' gradients: [ ['#29323c', '#485563'], ['#FF6B6B', '#556270'], ['#80d3fe', '#7ea0c4'], ['#f0ab51', '#eceba3'] ``` ## 进阶 **动态图标支持,引入CSS,使用参考第四章节 “动态图标” :**[使用说明](https://www.itggg.cn/xuexi/319.html) ```html <link rel="stylesheet" href="https://itggg.cn/cdn/font-awesome-animation.min.css"> ``` ## 其他 <div class="tip inlineBlock success"> 纯色渐变,参考官方文档 </div> [使用示例](https://sarcadass.github.io/granim.js/examples.html)  ## 下载 <div class="hideContent">此处内容需要评论回复后(审核通过)方可阅读。</div> Last modification:March 22, 2022 © Reprint prohibited Support Appreciate the author AliPayWeChat Like 0 如果你想请我喝奶茶的话
74 comments
效果不错,就是下载体验有点慢
我是新版带看板娘的了,这篇文章里面的是以前做的内容,新版带看板娘 加载的资源比较多ヾ(≧∇≦*)ゝ
|´・ω・)ノ
(/ω\)
erfv
牛逼,学习一下
测试
页面的js和css应用关了么?现在访问不了了
啊?哪个资源 ? 博客才恢复 之前备案掉了一个月 噗~
好棒
支持支持
|´・ω・)ノ
支持下看看!!!!
感谢支持
好看,品味审美都在线
哈哈 谢谢夸奖 👍
感谢
hi hi
666
大佬厉害,来更新了
看图片感觉不错,来白嫖大佬,哈哈
来白嫖大佬的
大佬,蹲个链接
拿来吧你😏
大佬,下载链接坏了😅
好耶
下载不了了,大佬OωO
啊啊啊哈哈 ,最近切换了存储,忘记补链接了,稍等我私发给你~
感谢
大佬,怎么又https://itggg.cn跳转到https://www.itggg.cn。就是这个页面跳转
域名解析添加一个@ 到主域名,也就是 itggg.cn 然后再添加一条到 WWW ,也就是说,www和@是两个站了,已经分开了,把你的主页代码都放在@ 解析下的站去就可以了。
学习了
感谢大神分享
感谢大神分享
白嫖怪来了
♥ 随便飘
白嫖怪来啦
欢迎欢迎 哈哈
白嫖白嫖~
随便飘!