原文发布时间为:2009-07-14 —— 来源于本人的百度文章 [由搬家工具导入]

原图片:http://cache.soso.com/wenwen/i/w_icon.gif

从这图片定位几张图片出来:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>图片定位</title>
<style type="text/css">
.dingwei{
background:url(http://cache.soso.com/wenwen/i/w_icon.gif) no-repeat;
}

.childd{
background-position: 0px -350px;
width:16px;
height:16px;
}
.childd2{
background-position:0 -251px;
width:16px;
height:16px;
}
.childd3{
background-position:-88px -320px;
width:16px;
height:16px;
}
</style>
</head>
<body>
<div class="dingwei childd" id="hehe"></div>
<div class="dingwei childd2" id="hehe2"></div>
<div class="dingwei childd3" id="hehe3"></div>
</body>
</html>

===================================

-50 -50 是指图片沿着容器div,要想左移动50,向上移动50,想要获取的那个图片才能在div的左上角那个位置开始。

可以用工具FastStone Capture的 矩形框截图工具定位。http://1.fjdx1.crsky.com/200907/FSCapture_v6.5H.rar

图片定位 css的更多相关文章

  1. CSS常用背景图片定位方法

    CSS背景图片定位其实对于每一位学习前端的同学来说,都已经非常熟悉了.网上铺天盖地的最常见的一种方案就是在父元素中relative,然后子元素absolute.这种方案当然好,不过带来的一个缺点就是会 ...

  2. CSS中背景图片定位方法

    转自:http://www.ruanyifeng.com/blog/2008/05/css_background_image_positioning.html 作者: 阮一峰 日期: 2008年5月 ...

  3. CSS背景图片定位

    原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...

  4. CSS 背景图像 背景图片定位

    背景图片定位 background-position属性可以给背景图片定位. background-position属性有两个值,第一个值是水平位置,第二个值是垂直位置.这两个值可以使用百分比来表示( ...

  5. (转)HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法

    http://blog.csdn.net/oscar92420aaa/article/details/51304067 CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中 ...

  6. HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法

    CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中,背景图片的定位方法有3种: 1)关键字:background-position: top left; 2)像素:bac ...

  7. HTML+CSS—背景图片、图片定位

    设置背景图片格式: background-image: url(img/ic.jpg); 注意点: 如果父容器面积大于背景图片,默认显示该图片整面平铺 设置是否需要平铺属性: background-r ...

  8. background的属性和背景图片定位的实例

    本文内容: 1.背景图片定位示例 2.background常用的属性值 3.background-repeat新增的round.space属性 4.background-size的属性值(着重介绍co ...

  9. 背景图片与 CSS的那些事

    在CSS中,背景图片的定位方法有3种: 1)关键字:background-position: top left; 2)像素:background-position: 0px 0px; 3)百分比:ba ...

随机推荐

  1. 两个list缩进为一个list,python

    # w_list = ['a', 'b', 'c', 'd'] # e_list = ['c', 'd', 'b', 'a'] w_list = ['a', 'b', 'c', 'd', 'ff', ...

  2. java抓取12306火车余票信息

    最近在弄一个微信的公众帐号,涉及到火车票查询,之前用的网上找到的一个接口,但只能查到火车时刻表,12306又没有提供专门的查票的接口.今天突然想起自己直接去12306上查询,抓取查询返回的数据包,这样 ...

  3. Nginx认证

    Nginx 的 ngx_http_auth_basic_module模块允许通过使用“HTTP基本认证”协议验证用户名和密码来限制对资源的访问. 配置举例: location / { auth_bas ...

  4. 关于PHPExcel导出Excel时身份证,数字会导出为科学计数的处理方法

    上次在开发一个项目时,用到PHPExcel导出数据,其中有导出身份证等长串数字时导出的Excel中显示为科学计数方式. 这种显示很不人性化而且量多了修改起来也很麻烦. 这是因为Excel处理数字里默认 ...

  5. commons-logging日志实现解耦

    一.需要解耦      日志是实际应用中的一个重要部分,日志系统也有许多开源的实现,如java.util.logging, logback, log4j系列等.      在使用日志系统时,如果与具体 ...

  6. python爬虫的基本思路

    爬虫:请求网站并提取数据的自动化程序. 流程: 发送请求 -> 获取数据 -> 解析数据 -> 存储数据

  7. 单片机入门学习笔记5:STC下载器

    STC下载器主要集成了, 1.芯片识别,下载/编程 2.端口识别 3.串口助手 4.KEIL仿真设置 5.芯片选型 6.范例程序 (集成了定时器,串口等例程) 7.波特率计算器 8.定时器计算器 9. ...

  8. CodeForces:#448 div2 a Pizza Separation

    传送门:http://codeforces.com/contest/895/problem/A A. Pizza Separation time limit per test1 second memo ...

  9. Jconsole连接Tomcat JVM

    修改java虚拟机启动参数 在%TOMCAT_HOME%\bin\catalina.sh文件的最顶端 JAVA_OPTS=”-Dcom.sun.management.jmxremote.port=10 ...

  10. codeforce GYM 100741 A Queries

    A. Queries time limit per test:0.25 s memory limit per test:64 MB input:standard input output:standa ...