a,input等元素在android原生浏览器下获得焦点时，元素外围会出现一个橙色的高亮边框（如下图）。

若要去除它，通常的办法是：

a:focus,input:focus{ -webkit-tap-highlight-color:rgba(0,0,0,0); }

近日，用到一些 CSS3 的属性制作其效果。

一直用这个网站在线生成css3的按钮（button），http://www.bestcssbuttongenerator.com/

又发现了一个PS的插件，如下：

Photoshop效果 转CSS3 小插件：

个人使用体验：1、生成的效果和PS效果非常接近，也许比自己写的逼真 2、代码较为简洁基本能直接使用       3、图层效果合并越少生成出的效果越好         4、精简版PS也能直接使用

使用方法：

        国内的设计师大都喜欢用px，而国外的网站大都喜欢用em和rem，那么三者有什么区别，又各自有什么优劣呢？

简单的说：

px是：相对长度单位。像素（Pixels）。1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

em是：相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

rem是：相对长度单位。相对于根元素(即html元素)font-size计算值的倍数。比如：我们定义如下，那么相对的font-size就是不同屏幕宽度的font-size，从而达到适配

text-overflow是一个常用的CSS属性，作用是让文本超出容器区域的部分以省略号显示。

要让它生效， 还需要配合设置其它几个css属性。示例CSS代码：

p { 
     white-space: nowrap; 
     width: 100%; /* IE6 needs any width */ 
     overflow: hidden; /* "overflow" value must be different from "visible" */ 
     -o-text-overflow: ellipsis; /* Opera 9-10 */ 
     text-overflow: ellipsis; /* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */ 
}

新出的html5新增了不少标签，性能更强，原来的很繁琐的功能几个标签就能实现，同时CSS3也推出，更是一大亮点，下面是css3的部分用法，在此总结一下，以供需要的朋友们，总共30个例子

1.长方形

#Rectangle{
width: 200px;
height: 50px;
background-color: red;

直接上代码，类名字就能说明意思：

.camnpr-rotate-90 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

效果如下：

这些三角形用图片都是可以达到一样的效果的，但当颜色和比例需要改动时，CSS只要简单的改变一下border的样式就可以了，图片可是要重新替换的，效果也没有那么容易调试，过多的图片也会对页面性能造成影响，所以还是推荐用CSS来实现喽~

rel canonical 属性值 -- rel="canonical"属性让搜索引擎知道当前网站中的重复或相似网页中，哪一个页面才是站长想让其抓取与收录的

 个人、商业均可自由使用

Font Awesome是完全免费的，无论个人还是商业使用。详见 协议。

 用CSS控制样式

用CSS能非常容易的改变这些图标的颜色、大小、阴影以及任何CSS能控制的属性。

昨天看到@import url（），不太常用，褒贬不一。一开始是由于一个兼容问题： @import url（/css/a.css） 很简单但出现了兼容问题，在ff下无法调用样式，大家都以为是@import搞的怪，但用link后问题依然出现。经过一番讨论原来是绝对路径在ff下是不认的。