免费的矢量图标库-网页开发者必备

大家好我是山河,最近有很多朋友问我有没有这些图标啊,那些图标啊,我很疑惑啊,这些东西不是有很多免费的图库吗?

今天就给大家分享一个,开发者必备的图库站

阿里巴巴矢量图标库

网站地址:https://www.iconfont.cn/

法律声明:

iconfont法律声明截图

关于版权©说明

iconfont法律声明截图

完整法律声明地址:iconfont 法律声明 (taobao.com)

个人开发者,不商用是免费的,如果用官方的进行商用,则要官方的书面许可,如果是用户提交的库,则看用户的要求,最好能得一份书面说明。

图库预览图

由此可以看出来,对于我们普通开发者还是非常舒服了。

本文就讲到这里了。

山河博客

PHP实现ping api

大家好我是山河,今天给大家分享点技术,很多小伙伴问我怎么写php的ping api,我跟他们说用exec或者systerm函数来实现,但是他们说主机商不允许使用这两个函数,让我想想办法。

既然不能直接使用dos命令来搞ping,那我们只能模拟ping了。

话不多说,上效果图

嘿嘿,这样效果也差不多。

我们运用php的fsockopen函数来模拟 HTTP连接 实现ping的效果,但实际与ping差距是很大的,因为ping是ICMP协议,而我们是使用tcp或者udp协议。

话不多说,上代码,本代码的模拟ping是使用tcp协议 (HTTP/1.1 和 HTTP/2 都是基于 TCP 传输协议),

HTTP/3 是基于 UDP 传输协议

<?php
/*
    此模拟ping仅仅只是 使用 HTTP协议 模拟ping。不是真正的ping,与真正的 ping 误差很大。
*/
    // ping次数
    $num = 5;
    // 执行时间
    function times(){
        list($usec,$sec) = explode(" ",microtime());
        return ((float)$usec + (float)$sec); 
    }
    function demo($host,$port=80,$i) {
        if($i == 0) {
            echo 'Ping 域名 '.$host.'IP: ['.gethostbyname($host).'] 端口:'.$port.'<br />';
        } 
            echo ping($host,$port);
    }
    function ping($host,$port=80) {
        $starttime= times();
        $ip = gethostbyname($host);
        $fp = @fsockopen($host,$port);
        if(!$fp) {
            return 'ping超时!';
        } else {
            $get = "GET / HTTP/1.1\r\nHost:".$host."\r\nConnect:".$port."Close\r\n";
            fputs($fp,$get);
            fclose($fp);
            $nowtime = times();
            $time = $nowtime - $starttime;
            $time = ceil($time * 1000);
            return 'Ping from '.$ip.':'.$port.' time = '.$time.'ms<br />';
        }
    }
    for($i = 0;$i < $num;$i++){
        echo demo('blog.shanhe.info',80,$i);
        //每次运行中间间隔1S
        sleep(1);
        //刷新输出缓存
        ob_flush();
        flush();
    }

好了,我是山河,本文到此结束

域名绕过备案

域名绕过备案

大家好我是山河,今天给大家分享一个域名绕备案方法,很实用。

大家都知道,备案是很麻烦的一件事,山河最近购买了几个天翼云服务器,但是我在腾讯云备案的域名不能在天翼云上直接用,还需要提交给管局审核一遍才能使用,备案时间又要花半个多月时间,那么这服务器不是白白浪费了十几天。

所以山河想了一个办法来绕过备案,先用着,等备案时间过了再换成正常的。

话不多说,上教程。

环境要求:

1. 一台服务器(宝塔面板/其他面板也差不多)

2. 一个域名(备案不备案都可以)

先打开服务器的宝塔面板

本次演示服务器是天翼云服务器

首先先进到天翼云服务器管理,把防火墙安全组开了

先点击

域名绕过备案

再点击更改安全组

(点击查看图片)

域名绕过备案

点击新建安全组

域名绕过备案

添加规则

域名绕过备案

放通81端口

然后解析域名

域名绕过备案

这里域名不用加端口!

然后打开服务器的宝塔面板

添加域名,注意,这里需要加上域名:81

域名绕过备案

这样就ok了,然后我们试着访问一下。

域名绕过备案

嘿嘿,成功了!

如果想要隐藏端口呢,可以使用ssl,走加密就可以直接访问域名不用加端口了。

如果觉得实用的话呢可以推荐给其他待备案中的小伙伴。

我是山河。原创文章!

山河博客HTML

一个动画渐变的科幻形按钮

大家好我是山河,今晚我给大家带来了一个很好看的按钮,动画效果很棒,代码大家自己借鉴吧。

话不多说,直接贴代码出来。

先上效果图(点击下面文字可以查看图片)

blog.shanhe.info
效果图

直接上代码

css代码块

a {
            display: block;
            width: 220px;
            height: 70px;
            z-index: 1;
        }

        a:after {
            content: '';
            background: linear-gradient(120deg, #6559ae, #ff7159, #6559ae);
            background-size: 400% 400%;
            animation: gradient 3s ease-in-out infinite, border 0.5s forwards ease-in-out reverse;
        }

        a>span {
            display: block;
            background: linear-gradient(120deg, #6559ae, #ff7159, #6559ae);
            background-size: 400% 400%;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: gradient 3s ease-in-out infinite;
        }

        .absolute-centering,
        body:after,
        a,
        a:after {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
        }

        .text-formatting,
        a {
            text-transform: uppercase;
            text-decoration: none;
            text-align: center;
            letter-spacing: 2px;
            line-height: 70px;
            font-size: 28px;
        }

        @keyframes gradient {
            0% {
                background-position: 14% 0%;
            }

            50% {
                background-position: 87% 100%;
            }

            100% {
                background-position: 14% 0%;
            }
        }

        @keyframes border {
            0% {
                -webkit-clip-path: polygon(0% 100%, 4px 100%, 4px 4px, 216px 4px, 216px 66px, 4px 66px, 4px 100%, 100% 100%, 100% 0%, 0% 0%);
            }

            25% {
                -webkit-clip-path: polygon(0% 100%, 4px 100%, 4px 4px, 216px 4px, 216px 66px, 216px 66px, 216px 100%, 100% 100%, 100% 0%, 0% 0%);
            }

            50% {
                -webkit-clip-path: polygon(0% 100%, 4px 100%, 4px 4px, 216px 4px, 216px 4px, 216px 4px, 216px 4px, 216px 4px, 100% 0%, 0% 0%);
            }

            75% {
                -webkit-clip-path: polygon(0% 100%, 4px 100%, 4px 4px, 4px 4px, 4px 4px, 4px 4px, 4px 4px, 4px 4px, 4px 0%, 0% 0%);
            }

            100% {
                -webkit-clip-path: polygon(0% 100%, 4px 100%, 4px 100%, 4px 100%, 4px 100%, 4px 100%, 4px 100%, 4px 100%, 4px 100%, 0% 100%);
            }
        }

html代码块

<a href="#"><span>按钮</span></a>

好了,本文到此结束。

我是山河

山河博客Code-2

JQ伪类选择器笔记(补充)

大家好我是山河,今天我又开始总结笔记了。

常用的伪类选择器有六种。

“位置”伪类选择器。

“子元素”伪类选择器。

“可见性”伪类选择器。

“内容”伪类选择器。

“表单”伪类选择器。

“表单属性”伪类选择器。

在jQuery中,只有:nth-child()、:nth-of-type()这两个选择器的下标是从1开始的,其他所有的选择器和jQuery方法都是从0开始的。(重点)

笔记源于 《从0到1:jQuery快速上手》此书,推荐各位看,建议有基础者学习,能帮助补充大量jq的知识,评价中等,

山河博客PC

JQuery选择器笔记

大家好,我是山河,最近有在学Javascript,感觉学得差不多了,就去学习JQuery,毕竟咱们自学的基础打好了之后主要是实战,最近也实战撸了原生js的几个小项目,但是感觉有点费力耗时间,然后就选择了JQuery。

本文是JQuery的笔记,接下来几天都会陆陆续续的从本地笔记转移进博客文章,作为云端记录,随时查看。

PS:我是黑马pink老师学的,笔记截图均是来自哔哩哔哩上的黑马Pink老师的视频。

另外附上JQuery在线手册 jquery 在线手册 | jQuery API 中文手册 | jQuery 速查表 | jQuery 参考手册 | jQuery CHM | jQuery 在线文档 | jQuery 1.12.1 (hemin.cn)

本文到此结束。

pink老师视频

https://www.bilibili.com/video/BV1Sy4y1C7ha