61,112
社区成员
发帖
与我相关
我的任务
分享关于背景图片定位的问题
我有个div，需要用到一张图片中某部分的图，在div中又同时想让这个图显示在div中的某个位置，请问可能实现吗？
比如我需要的图片是a.jpg 需要其-30px -20px的位置上大小为width:30px; height:40px;的这一部分。
div的大小是100px 100px，我想让上面裁取的图显示到div的右下角， 这样可能做到吗？
谢谢！
比如我需要的图片是a.jpg 需要其-30px -20px的位置上大小为width:30px; height:40px;的这一部分。
div的大小是100px 100px，我想让上面裁取的图显示到div的右下角， 这样可能做到吗？
谢谢！
...全文
请发表友善的回复…
发表回复
Cyril_Tam 2009-09-25
- 打赏
- 举报
http://topic.csdn.net/u/20090923/20/fe55608f-9d5d-4f79-863f-a49fd2161ed3.html?1687919942
wappibz 2009-09-25
- 打赏
- 举报
因为显示一张图的一部分要用到background-position, 而让背景图显示到div的某个位置，同样需要background-position属性，所以想问问有没有别的方法可以实现。
wappibz 2009-09-25
- 打赏
- 举报
[Quote=引用 10 楼 popo0027 的回复:]
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type" content="text/html; charset=utf-8"/><title>无标题文档</title><style>
.partimg{
width:30px;
height:40px;
border:solid 1px #666;
background-image:url("a.jpg");
background-position:-30px -20px;}</style></head><body><divclass="partimg"></div></body></html>
是这个吗？
[/Quote]
无法做到让图片显示到partimg的右下角。
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type" content="text/html; charset=utf-8"/><title>无标题文档</title><style>
.partimg{
width:30px;
height:40px;
border:solid 1px #666;
background-image:url("a.jpg");
background-position:-30px -20px;}</style></head><body><divclass="partimg"></div></body></html>
是这个吗？
[/Quote]
无法做到让图片显示到partimg的右下角。
飞起来一脚 2009-09-23
- 打赏
- 举报
<!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=utf-8" />
<title>无标题文档</title>
<style>
.partimg
{
width:30px;
height:40px;
border:solid 1px #666;
background-image:url("a.jpg");
background-position:-30px -20px;
}
</style>
</head>
<body>
<div class="partimg"></div>
</body>
</html>
是这个吗？
yate123 2009-09-23
- 打赏
- 举报
自我感觉是不可以的，因为图片如果显示不全的话，就几乎不可能有好的效果，你会隐藏一部分图片，当鼠标以拖动的时候就会显示出'bug'特别难看
wappibz 2009-09-23
- 打赏
- 举报
楼上的链接看了 没有实例。
谁能给个实例说明么？
谢谢！
谁能给个实例说明么？
谢谢！
cs5276 2009-09-21
- 打赏
- 举报
用margin，设置成负值
bingai0220 2009-09-20
- 打赏
- 举报
CSS Sprites技术。楼主自行了解一下
http://www.blueidea.com/tech/web/2007/4967.asp
http://www.blueidea.com/tech/web/2007/4967.asp
wappibz 2009-09-20
- 打赏
- 举报
help please...
wappibz 2009-09-20
- 打赏
- 举报
how？？
yuexiaolei_520 2009-09-19
- 打赏
- 举报
可以！
wappibz 2009-09-19
- 打赏
- 举报
比如<div class="aa"></div> 图片是a.jpg
能给个确切的css写法么？
谢谢！
能给个确切的css写法么？
谢谢！
easetech 2009-09-18
- 打赏
- 举报
可以 a.jpg 作为 background-image 截取的 图 在div里面 设置 style 就可以
这只是其中一个办法
这只是其中一个办法
