冰剑'blog

Content作为css的一个属性，它可以和伪对象:before :after一起使用。

例如：

CSS

.xunzou:before { 
        content:"你好啊"; 
        color:#F00; 
    } 

html

<div class="xunzou">欢迎光临我的blog</div>   

浏览器显示的应该是：

在hulu（美国知名的视频网站）上看到了这个视频缩略图增加一个play的效果，突然心血来潮，就也想做一个这样的效果。

思路：利用a标签，里面包含一个视频缩略图片，鼠标放上去之后，增加边框，图片上增加一个播放按钮，播放按钮用背景图来展示。
a标签里需要放置一个em,默认的时候隐藏，hover的时候em显示出来。

查看演示：http://www.xunzou.com/demo/thumbnail/
下图左边为默认显示效果，右边为鼠标放上去的效果。
 

今天说一下CSS的clip属性，这个属性可能不经常用，但是也是比较有用的属性之一。
我们先来看一下它的语法：

 语法：clip : auto | rect ( number number number number )

取值： auto: 默认值。对象无剪切； rect ( number number number number )：依据上-右-下-左的顺序提供自对象左上角为(0,0)坐标计算的四个偏移数值，其中任一数值都可用 auto 替换，即此边不剪切

...