Hot For Coding
  • 网页中的图片

    我们字符集是定义字符跟数字关系方便用于传输,但计算机中如何显示图片呢?一样,计算机并不知道图片是什么,是我们抽象出来的某种可以使用计算机表达的数据集。

    图片原理

    以简单的来说,所有颜色都可以使用红绿蓝调出所有颜色,简称RGB(Red, Green, Blue),CSS上还有一个可以使用的叫RGBA,其中A是Alpha可以表达透明度。也就是是三组值即可以表达一种颜色,当然这三个值肯不能无限大,毕竟只要肉眼分辨不出来的色值即可,以网页为例子,RGB只能定义三需要在0到255之内的值组成。这里每一个色值最高只能到255估计跟一个字节大小有关,表达RGB固定占用三个字节。

    ...

    READ ALL

  • 推荐一个CSS字体图标库

    Font Awesome是一个基于图标字体库,结合CSS3支持服务器端字体,使用:before伪类与content属性写出的一款CSS图标库。

    full

    官网 http://fortawesome.github.io/Font-Awesome/icons/

    以前要在网页上显示图标,基本都是使用Gif图片的居多,目前仍然有不少站点还在使用Gif图标,Gif图标的特点是体积小,可以制作帧频动画,支持透明。但缺点是放大就有齿距,不易于修改,不能通过CSS控制颜色。

    当然,使用以上字体库有很大优势,体积小(相比图片小),矢量(放多大都不影响),变色(color定义它的颜色),缺点是它只能是单色图标,不能background使用。

    ...

    READ ALL

  • 推荐一个设计的非常有创造力的动画

    这个动画是在http://ellislab.com/codeigniter这个页面发现的,因为觉得他们写的这个动画非常有制作上的创意,觉得可以给大家分享一下。页面中的动画就是那几条飞来飞去的的线条,其实种效果在Flash里非常容易实现,但我发现这个是使用svg结合css完成,所以研究了一下。

    利用svg制作一个线条镂空的模板

    full

    途中你看到的白色线条并不是线条,而是镂空的,因为网页背景是白色所以看上去像是白色的线条,如果网页背景是蓝色,那么看上应该是这个效果:

    full

    ...

    READ ALL

  • 利用滑轮事件提高用户体验

    偶然一次在亚马逊上买电子书,发现亚马逊有一个细节做的相当好,在一个满是商品的列表页中我滑动滚轮时会按照每一行商品的高度度进行滑动,这不仅让网页看上去美观而且也提高用户体验。而有一些在线购却没有这么干,于是滑动鼠标时可能会把某个商品卡在半屏处。

    full

    因为每一行的商品节点高度都一致,所以只要做成按照商品高度来作为滚动每次长度很容易,我写了一个DEMO,大家可以看看

    full

    DEMO点这里看

    ...

    READ ALL

  • vim编辑器tab设置4个字符

    Window版本的gVim在默认情况下tab宽度为8个字符,习惯使用4个空格宽度作为tab来说有点别扭,可以找到gVim的安装目录下的_vimrc文件添加如下代码即可

    " size of a hard tabstop
    set tabstop=4
     
    " size of an "indent"
    set shiftwidth=4
     
    " a combination of spaces and tabs are used to simulate tab stops at a width
    " other than the (hard)tabstop
    set softtabstop=4
    You may also want to try the following:
     
    " make "tab" insert indents instead of tabs at the beginning of a line
    set smarttab
     
    " always uses spaces instead of tab characters
    set expandtab
    

    ...

    READ ALL

  • 关于字符集的理解

    在计算机中,所有东西都是字节,所以文字也是使用字节表示。

    ASCII

    早期的时候为了方便通用,推出了一套英文字母与数字对应的关系。这套字符集总共也就包括了128个字符,我们知道计算机的一个字节可以表示256种不同的状态,所以这套字符集使用一个字节就可以满足使用,一直沿用至今。

    字符集乱码

    早期的时候网页中文大部分流行使用GBK/GB2312编码,网页上使用某种固定的编码之后,如果客户端的操作系统没有内置相应的字符集,结果就只能是乱码。打个比方,使用某种规则组成的数字传输到另一段之后也要配置相应的密码本才能解读,这就有点类似战争时期的摩尔斯电码,双方各持编码规则手册,如果中间有人拦截到摩尔斯电码如果没有编码规则手册你也不知道双方在传达什么消息。

    ...

    READ ALL

  • Google将用encryption加密技术突破被屏蔽的国家

    自2010年谷歌被国情所迫撤离中国以后,就一直时有小到消息称谷歌将会卷土重来。不就前网上看到有人说不就前g.cn不是跳到google.com.hk而是直接能在能在g.cn上搜索,而恰巧不久前谷歌执行董事长埃里克·施密特表示

    谷歌在未来10年内,用“encryption(加密)”进入审核制度较严的国家,包括中国和朝鲜

    施密特还表示谷歌并没有完全放弃中国市场,此言暗示着谷歌近期将有所行动。2010年谷歌撤离后国内某度的份额全盘占领,直到360小戳了一下分到一杯羹。Gmail这两年更是抽风的厉害,许多原本使用Gmail的中国用户被迫抛弃Gmail转用国内服务。

    ...

    READ ALL

  • 1月21日DNS大面积故障

    昨天,中国大部分地区DNS故障出现大量站点无法访问,DNS是将域名解析IP后才能真正请求目标资源,起到一个关键的作用。

    full

    虽然DNS出故障后IP请求的目标资源的方式不受影响,但没有几个使用IP访问的(除一些特殊的以外),DNS也是一台普通物理服务器,按理说发生点故障是很正常的。但区区只发生在中国,然后所有请求都转向自由门,在发布说是被自由门攻击了,这事就戏剧多了。

    全世界只有13台,这13台根域名服务器中名字分别为“A”至“M”,其中10台设置在美国,另外各有一台设置于英国、瑞典和日本。也就是说国内用户访问站点先从国内的分支DNS服务器开始查找,逐级向上,最后可到根。但昨天的故障是根本都无法访问,专家说可能又是网络运营商的问题,擦边球踢来踢去迷惑大家。其实大家用心想想就知道怎么回事了,乌龙事件!

    ...

    READ ALL

  • JavaScript遍历数组最好使用for而不是for-in

    在JavaScript中,严格来说所有的数据类型鼻祖都是Object,所以我们来看看以下这个例子:

    >>> var arr = ["a", "b", "c"];
    undefined
    >>> for(var i=0; i<arr.length; i++){ console.log(i); }
    0
    1
    2
    >>> for(var i in arr){ console.log(i); }
    0
    1
    2
    

    以上例子定义了一个包含3个元素的数组arr,然后分别使用for和for-in来遍历它的元素,结果都没问题。但如果我给arr添加一个原型方法,结果就不一样了。

    ...

    READ ALL

  • 关于字节的一些要点

    计算机只能识别0和1,简称二进制。表达人类常用的十进制数字,比如3,可以使用更多位的二进制来表示,这个过程我们称之为进制转换。

    十进制3转二进制 0011

    使用多少位的二进制表达一个数字我们称之为bit,在计算机中, 最小的单位是字节(Byte),它由8个bit组成,所以在计算机中要表达十进制3,利用一个字节即可表示

    一个字节存储3 0000 0011

    因为一个字节共有8个位,每一位共有两种状态0和1,即可组成2的8次方,256种不同的状态,所以一个字节最多可以表达十进制0到255之间的数字,如果超过了怎么办?超过了就使用2字节(16位)存储,以此类推

    ...

    READ ALL