社区
CSS
帖子详情
(急)background-position属性怎么解决,高手请进
mastermanager
2011-10-19 09:59:59
background-position属性测试结果
IE6、IE9、火狐、世界之窗、腾讯(一样的效果)
IE7、IE8、谷歌、遨游(偏移+1个像素)
怎么解决,感谢了!
尽量不用hack
...全文
540
11
打赏
收藏
(急)background-position属性怎么解决,高手请进
background-position属性测试结果 IE6、IE9、火狐、世界之窗、腾讯(一样的效果) IE7、IE8、谷歌、遨游(偏移+1个像素) 怎么解决,感谢了! 尽量不用hack
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
11 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
jy02409187
2011-10-21
打赏
举报
回复
<style>
body{ font-size:12px; background:#fff; font-family:"宋体","Arial Narrow"}
body, ul, li, h1, h2, h3, h4, h5, h6, p, th, td, dl, dt, dd{ margin:0; padding:0}
ul, li{ list-style-type:none}
table{ border-collapse:collapse; border-spacing:0; border:0}
img{ border:none; vertical-align:bottom}
a, button{ cursor:pointer}
.qiandao {
margin:1px;
width:300px;
height:200px;
background:url(http://img-cdn.mediaplex.com/0/10759/138442/Intel_Q4LeadGen_735x90_Sudoku_Static.jpg) no-repeat 0 0;
overflow:hidden
}
</style>
<div class="qiandao"></div>
不明白你是怎么偏移 这个IE都正常
mastermanager
2011-10-21
打赏
举报
回复
[Quote=引用 7 楼 king_lyly 的回复:]
引用 6 楼 mastermanager 的回复:
引用 5 楼 king_lyly 的回复:
好像没遇见过 要不你这样试一下吧 别写 background-position 这个了
直接 复制a的
background:url(img/1.gif) 0 0 no-repeat;
你试试
这个和我写的那个效果一样的
要是一样 就不让你试了,很多情况……
[/Quote]
我的意思是像你那样写是一样的
zjtpiaoxue
2011-10-20
打赏
举报
回复
偏移了,没遇到过,不过最可能就是你的背景图片所在的容器设置了padding或border
鸟先生
2011-10-20
打赏
举报
回复
顶一下 这个 我也不懂 等待高手。。。
king_lyly
2011-10-20
打赏
举报
回复
[Quote=引用 6 楼 mastermanager 的回复:]
引用 5 楼 king_lyly 的回复:
好像没遇见过 要不你这样试一下吧 别写 background-position 这个了
直接 复制a的
background:url(img/1.gif) 0 0 no-repeat;
你试试
这个和我写的那个效果一样的
[/Quote]
要是一样 就不让你试了,很多情况都不一样的
mastermanager
2011-10-19
打赏
举报
回复
好的,楼上的意见采纳哈,
我现在把鼠标经过图片2个图片合并到一个图片上,但是定义HOVER的这个属性的时候用background-position
就出现差一个像素的问题
Acesidonu
2011-10-19
打赏
举报
回复
兼容性却是麻烦
king_lyly
2011-10-19
打赏
举报
回复
看什么背景了,如果是 标题 前端的图标 或 li前端的小点,你可以 用 等高 正好放到空间里 你试一下吧 ,你只写了 这个background-position ,把 问题说 详细点 解决 能好点
还有 不要拿这种标题 来卡人, 什么叫高手, 什么叫菜 鸟, 求助就是求助 小小建议
mastermanager
2011-10-19
打赏
举报
回复
[Quote=引用 5 楼 king_lyly 的回复:]
好像没遇见过 要不你这样试一下吧 别写 background-position 这个了
直接 复制a的
background:url(img/1.gif) 0 0 no-repeat;
你试试
[/Quote]
这个和我写的那个效果一样的
king_lyly
2011-10-19
打赏
举报
回复
好像没遇见过 要不你这样试一下吧 别写 background-position 这个了
直接 复制a的
background:url(img/1.gif) 0 0 no-repeat;
你试试
mastermanager
2011-10-19
打赏
举报
回复
在线等,有人能解决吗?
CSS3实现鼠标悬停背景图片平滑缩放动画效果
简介:CSS3鼠标hover背景图片缩放动画是一种提升网页交互体验的常用技术,通过
background
-size、transition和:hover伪类等CSS3
属性
,实现在鼠标悬停时背景图平滑放大并恢复的效果。本案例详细讲解了该动画的实现原理与代码结构,帮助开发者掌握无需JavaScript即可创建动态视觉反馈的方法,适用于各类需要增强视觉吸引力的网页设计场景。
图片铺满屏幕自适应大小的完整实现方案
设计阶段就要预留安全区:告诉设计师,重要元素放在中间 60% 区域内,避免被裁。永远不要用100% 100%拉伸图片:失真是不可逆的丑。cover是利器,但不是万能药:记得搭配微调焦点。性能和美观要兼顾:懒加载 + LQIP + 预加载,三位一体。兼容性要有兜底:IE 虽死,余威尚存。技术一直在变,但
解决
问题的思路不变。真正的
高手
,不是只会写代码的人,而是懂得权衡取舍、因地制宜的人。
从前慢-CSS基础
CSS 1.1 CSS初识 CSS(Cascading Style Sheets) ,通常称为CSS样式表或层叠样式表(级联样式表) 1.2 引入CSS样式表 行内式(内联样式) <标签名 style="
属性
1:
属性
值1;
属性
2:
属性
值2;
属性
3:
属性
值3;"> 内容 </标签名> 内部样式表(内嵌样式表) <head> <style type="text/CSS"> 选择器(选择的标签) {
属性
1:
属性
值1;
一个超好的鼠标右键JavaScript代码
ddd.DreamMenu {
position
:absolute; visibility:hidden; z-index:100; overflow:hidden; width:150px;
background
-color:buttonface; border:dimgray 1px solid !i
2022年最新前端面试题(大前端时代来临卷起来吧小伙子们..持续维护走到哪记到哪)
HTML和Css部分 1、对BFC规范(块级格式化上下文)的理解 BFC 块级格式化上下文 一块独立的区域,有自己的规则,bfc中的元素与外界的元素互不影响 BFC是一块用来独立的布局环境,保护其中内部元素不受外部影响,也不影响外部。 怎么触发BFC 1. float的值left或right 2. overflow的值不为visible(默认) 3. display的值为inline-block、table-cell、table-caption 4.
position
的值为absolute(绝对定位)或f
CSS
61,125
社区成员
60,706
社区内容
发帖
与我相关
我的任务
CSS
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
复制链接
扫一扫
分享
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章