当前位置:编程学习 > C#/ASP.NET >>

css高级定位图片中的某个图片

怎样准确定位这张图片中电子书那一块的图片。 --------------------编程问答--------------------

代码:
 
div{ background:#FFF url(image) no-repeat fixed x y;}
 

这里的background的属性值依次为:
 
#FFF 背景色:(颜色值,背景图片没有覆盖的地方,或者没有背景图片时表现的背景色)
image 背景图片:(这里是图片的地址)
no-repeat 是否重复:(图片小于容器的大小时,默认会重复排列图片以填满容器,no-repeat表示不重复,只有这个时候后面的定位坐标才有用。)
fixed 背景是否随容器滚动:(有两个可选值,scroll滚动,fixed不滚动,默认是scroll)
x y 背景图像的定位:(注意,只有在no-repeat下定位才有意义。这个就是今天要讲的重点)
--------------------编程问答-------------------- http://www.jb51.net/css/23213.html 利用CSS定位背景图片 background-position 
绝对讲解详细
--------------------编程问答-------------------- 1. 关键字, 例如: background-position: top right;
优点: 直观, 可用性高, 各浏览器中表现一致.
缺点: 缺少间隔尺寸. 三个垂直的 (top, center, bottom) 和三个水平的 (left, center, right) 只能为你组合出最多 9 个位置. 不存在其他混式的组合. 并且很难像其他两种数值定位方法一样使用算数进行控制.

2. 像素, 例如: background-position: 0px 0px;
优点: 概念容易被理解, 只要知道如何测量容器左上角和图片左上角之间的距离, 就能准确地推测出图片显示的位置. 像素还能够精确的用数学来控制定位.
缺点: 你必须知道确实的值.
原理, 如图. 其实就是图片左上角相对于容器左上角的坐标关系.

3. 百分比, 例如: background-position: 80% 50%;
优点: 可以使用数学来控制定位, 并且比像素定位更加灵活.
缺点: IE 中无法处理复杂的百分比定位. 你可以看看这个测试.
原理, 如图. 与像素定位不同, 它的百分比位置是指容器和图片内部的相应位置作为显示的位置. --------------------编程问答--------------------
<div style="width:670px;height:40px;background:url(/upload/20131225/goldzone_img_1.png) 0px -157px no-repeat;"></div>
--------------------编程问答--------------------
楼主这是要拼图啊。。css
--------------------编程问答--------------------
楼主得学学要不看楼上的也看不太懂滴
补充:.NET技术 ,  ASP.NET
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,