你可以在不移动文本的情况下使用CSS移动背景吗?

时间:2018-01-20 22:02:48

标签: html css background-image

我目前正在开设一个徽标在Internet Explorer中不起作用的网站:http://core2062.com/

此网站的创建者将文本设为超链接,然后应用背景图像添加其背后的徽标。在除IE之外的浏览器中,徽标显示在文本的左侧。这是我正在使用的CSS:http://dev1.core2062.com/wp-content/themes/CORE-Website/style/ie.css

徽标的实际HTML是:

<a id="logo" href="http://core2062.com" title="Click here to go back to the main page.">CORE<br/>2062</a>

由于文本和背景都是超链接,我无法修改文本或仅修改背景而无需修改另一个。由于无法仅仅定位超链接中的文本,是否可以以某种方式手动将背景向左移动,或以其他方式将文本移动到右侧?

我尝试将margin-left和padding-left设置为0,但是将背景和文本移动到左侧,这就是为什么我要移动一个而不是另一个。

我没有修改任何HTML(br不是我的)。它大约在10年前编码。

2 个答案:

答案 0 :(得分:1)

使用带有负数的background-position,例如评论中尝试的-45像素,可以将徽标从正常位置推离侧面。

答案 1 :(得分:0)

通常,此处的模式是在徽标text-indent: -9999px上使用<a>来隐藏文本(例如,将其保留为语义含义 - 例如搜索引擎)。

text-indent会将文字-9999px移到左侧(<a>的边界之外),但背景将保持原样。

要将背景置于此范围之外,请使用background-position