5 个简单实用的 CSS 属性
作者：tinyhill 来源：蓝色理想 发布时间：2010-03-10 11:00:00
标签：CSS,属性,CSS3
这篇文章介绍了 5 个实用的 CSS 属性。你应该很熟悉，但很可能很少会使用到。我并不是在谈论展望全新的 CSS3 属性，我指的是旧的 CSS2 中的属性，如：clip，min-height，white-space，curosr 和 display 等一些被所有浏览器广泛支持的属性。因此，千万不要错过这篇文章，因为你可能发现它们竟有如此之大的用途。
1、CSS Clip
剪辑 (clip) 属性就像一个面具。它允许你使用矩形掩盖页面元素的内容。要剪辑一个元素：你必须指定其 position 属性为 absolute，然后指定相对于元素的 top，right，bottom，left 值。
图片剪辑实例（演示）
以下示例演示了如何使用 clip 属性掩盖一张图片。首先，指定 <div> 元素为 position:relative，然后指定 <img> 元素为 position:absolute，并且根据实际需要设定 rect 值。
.clip {
position: relative;
height: 130px;
width: 200px;
border: solid 1px #ccc;
}
.clip img {
position: absolute;
clip: rect(30px 165px 100px 30px);
}
图像调整尺寸和剪辑（演示）
在这个示例中，我将展示如何调整图像尺寸和剪辑图片。素材图片是矩形的，我想将其削减至 50％ 的尺寸，用来创建一个正方形格式的缩略图。因此，我用宽度和高度属性来调整图像，并使用 clip 剪辑属性予以掩盖。然后用 left 属性将图片移开左侧 15px 的距离。
.gallery li {
float: left;
margin: 0 10px 0 0;
position: relative;
width: 70px;
height: 70px;
border: solid 1px #000;
}
.gallery img {
width: 100px;
height: 70px;
position: absolute;
clip: rect(0 85px 70px 15px);
left: -15px;
}
0
投稿猜你喜欢
很久没写blog，太忙了。没什么时间写复杂的东西，重新把颜色渐变效果写一遍。关于颜色的效果一般就两个，颜色梯度变化和样式的颜色渐变，前者在i- 内容摘要：除了内部性能增强和优化外，IIS6.0版本的 Active Server Pages(ASP)&nb
- 看到了很多关于如何读出图片的长度的高度的方法，其实都不实用，大多都是通过图片的大小来判断的，图片的种类众多，通过大小来判断难免要制造很多的代
- 本文从多个角度来讲解如何在Access数据库上如何上传并且显示上所上传图片。在 * 站制做过程中，需要上传图片、显示图片，上传的图片要能够保
- 精妙的"SQL"语句:◆复制表(只复制结构,源表名：a 新表名：b)SQL: select * into b from
- 要想在不宽裕的页面展现丰富的内容，现在通用的做法使用tab，在一块区域通过tab切换来更换该区域的内容。这篇文章分析了tab设计很在理，今天
- 代码如下:<％ '功能:取得文件扩展名 Function getFileExt(sFileNam
- 相信没有人不知道 Firebug 是什么东西，但有时候我们糟糕的代码不想让同行轻松的使用 F12 就能一览无遗。那么怎么办呢？这里有个猥琐的
- 看看下面这个刚才提到的下拉列表的例子，就是将Application Object作为一个变量用来存储下拉列表的菜单项的：<％=&nbs
- 晚上突然间看到大猫的头像在闪动，速度打开一看，发现他问，以前我写button标签的时候有没有写type属性，老实的我只有诚实地告诉他，我没写
- 相关的题外话：一、操作系统window系统内部都是unicode的。文件夹名，文件名等都是unicode的，任何语言系统下都能正常显示。二、
- HTML与CSS在Flash中的应用:不小心看到同事Den在弄个小东西：在Flash里使用HTML和CSS，代码是这样：var m
- 用户登录验证脚本,Chkpwd.asp<％ '=======用户登录验证脚本======= '
- 年前帮manager 招GUI设计实习生 (PS. 这个实习生职位依然open，欢迎有兴趣的同学来投，邮箱jj.ying [at] hp.c
- 有时在项目中会遇到通过在页面中采用iframe的方式include其它页面，这时就会考虑不要因出现滚动条而影响页面效果，但include页面
- 随着因特网的发展，在网络环境中，数据库应用渐渐向操作简单、功能实用的方向发展。本文介绍如何利用ASP技术实现对数据库进行在线维护的方法,并给
- 为你的网站,博客等添加rss聚合功能,给出rss.asp和rss.xml两种的聚合代码看过的朋友可帮忙顶哦,这些代码都是第一次发的,外面很多
- 1、元旦之前受赵晨之邀作为讨论嘉宾参加了ACM组织的“人与信息社会巡讲”。2、去之前赵晨发给了我大致的讨论提纲。咣当了好几下~说实话，我是硬
- 前言：最近某个时间开始，特别留意了一下Web标准中柱状图，也就是英文中的bar graph的实现。虽然实现方法各异，效果不尽相同，但是总体来
- 在 PHP 中表示空的map或空数组都是以空数组形式，在转化为json数据时，会将空数组统一 json 序列化成 []，这样就存在
