触屏

标准的触屏事件有以下几种：

• touchstart:当手指碰到屏幕的时候触发
• touchmove:当手指在屏幕滑动时触发
• touchend:当手指离开屏幕时触发
• touchcancel:当一次触摸事件被中断时触发

触屏事件对象包含的一些常用属性：

• touches：记录当前触屏关键点的数组
• changedTouches:记录touches变化后关键点的数组

每一个touch点包含ClientX、ClientY、…

该Demo来自chris coyier的Animation of How CSS Triangles Work。

如果看不到Demo，则是被和谐了。

See the …

原文地址

http://css-tricks.com/using-svg/

什么是SVG?

svg是和种矢量图形格式，全拼是：Scalable Vector Graphics (就像AI中的矢量图一样)。在网页上使用SVG很简单，但是有一些东西是你需要知道的。

为什么要用SVG?

• 很小的文件格式
• 缩放到任意大小都不会失真(超小的情况除外)

花从何来(:before+:after)

原Demo，觉得好玩儿，照葫芦画瓢了一下：

最终的效果：Demo。

在这个效果里面，有很多的“花瓣”,我们需要考虑的就是这些“花瓣”从哪里来，如何分散到四周等等。

在HTML中，最基本的只需要一个元素就好了，这里我放一个div.flower(~~为了好看，还是在里面放一个笑脸吧~~)。

<div class="flower">
	<h1>\^_^/</h1>

li里有图片的情况

有如下这样一段HTML：

<ul>
	<li><img src="demo.jpg" alt="" /></li>
	<li><img src="demo.jpg" alt="" /></li>
	<li><img src="demo.jpg" alt=""