登录 |

CSS 截图

2009年04月1日 下午 00:48 | 作者:

一、使用clip剪切。

clip 用于设置对象的可视区域,只对绝对定位的对象有效,必须使用position:absolut;

使用方法:clip:rect{上 右 下 左}

eg:img{position:absolut; clip:rext(10px 300px 300px 20px);}

最终显示图片大小w×h为300-20×300-10=280×290的图像。

二、使用div强制剪切

div {width:280px; height:290px; overflow:hidden;}

就可以达到跟第一种方法一样的效果,但是是以左上角为固定点进行剪切的,

三、使用margin

margin-bottom:-10px;/*图片底部10px不显示*/

如:
{
background:url(/*网络图片地址*/) no-repeat 55px 17px/*图片坐标定位,参数自己可以设定*/;
margin-bottom:-40px!important /*图片底部40px不显示*/;
}

如截顶部,则可以类推

一句CSS实现圆角矩形

2008年07月3日 下午 14:04 | 作者:

我们知道,使用<fieldset>标签,IE会解析成圆角矩形,而Firefox会解析为矩形,事实上,Firefox提供了一套css方法精确控制边框幅度,他们是:

-moz-border-radius (全局)
-moz-border-radius-bottomleft
(左下角)
-moz-border-radius-bottomright (右下脚)

-moz-border-radius-topleft (左上角)

-moz-border-radius-topright (右上角)

实现兼容Firefox的圆角矩形,只需一句CSS:

fieldset {
-moz-border-radius:6px;
}