用CSS截取图片中的某一块怎么写？？

html-css09

用CSS截取图片中的某一块怎么写？？,第1张

background:url(pic.jpg) no-repeat left top

后面两个参数就是移动图片位置的，第一个是水平位置，如left或者right或者center，第2个是垂直位置，如top或者bottom或者center，也可以是数字，如

background:url(pic.jpg) no-repeat -10px -20px

具体看你要截取的位置

用background-position: 给背景定位

.img{ background-image:url(bj.jpg)width:79px height:30background-position: 00}显示绿色背景

.img{ background-image:url(bj.jpg)width:79px height:30background-position: 0 30}显示黄色背景

下面这样做应该可以吧

-------------------------------————————————————————————

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">

<title>无标题文档</title>

<style type="text/css">

<!--

body,td,th {

font-size: 12px

}

.img{ background-image:url(bj.jpg)width:79px height:30}

.01{background-position: 0 0}

.02{background-position: 0 30}

-->

</style></head>

<body>

<div class="img 01"></div>

<div class="img 02"></div>

</body>

</html>

要调整背景图的渲染尺寸，需要用到background-size这个样式规则，但这是CSS3新增的，所以目前暂时没有全兼容的解决方案。

哦，这个意思，那么如果你贴背景图的容器高度与背景图那几个logo一致，就采用纵向排列图片，垂直定位的方式；如果容器宽高都比logo尺寸大，那就没办法了，再嵌入一个小容器专门显示这个图标吧。