收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 9943|回复: 6

[CSS3] 怎么让 span 背景图片右对齐并文字往左移 28px ?

[复制链接]
发表于 2014-3-26 11:02:57 | 显示全部楼层 |阅读模式
25体力

网站上有个 span ,怎么让 span 背景图片右对齐并文字往左移 28px ?

演示地址:

代码:

 提示:您可以先修改部分代码再运行

hhh.png
发表于 2014-3-26 11:02:58 | 显示全部楼层

  1. .validate-message {
  2.     background: url("http://www.dolanlik.com/msg_bg.png") no-repeat scroll 138px -147px rgba(0, 0, 0, 0);
  3.     border: 1px solid #E6E6E6;
  4.     color: #999999;
  5.     display: inline-block;
  6.     font-size: 12px;
  7.     line-height: 25px;
  8.     margin-right: 5px;
  9.     padding-left: 28px;
  10.     text-align: left;
  11.     width: 130px;
  12. }
复制代码
回复

使用道具 举报

发表于 2014-3-26 12:15:20 | 显示全部楼层
图片没有右对其是因为图片宽了,图片右边还有一段白的,要对其的话最好是换一张图片,文字左移可以用padding-right:28px;就可以在span上留一段空隙
回复

使用道具 举报

发表于 2014-3-26 13:24:45 | 显示全部楼层
文字变成左对齐,text-align:left,背景图片的background-positionX:right;应该就可以分开了,
回复

使用道具 举报

发表于 2014-3-26 15:57:40 | 显示全部楼层
是不是 这样?
QQ截图20140326155810.png
回复

使用道具 举报

发表于 2014-3-27 10:27:17 | 显示全部楼层

 提示:您可以先修改部分代码再运行

回复

使用道具 举报

发表于 2014-4-2 18:25:49 | 显示全部楼层
楼上正解哦,这位亲
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-9-25 12:50 , Processed in 0.109100 second(s), 9 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表