Question

我正在使用此网站edsys.in。最后一个菜单项锚点（教育内容）的背景gif包含文本趋势新。应用以下CSS时图像消失：

  background-position-y: 20px;

在锚点上设置高度不起作用。

这是我目前的CSS：

.trending a {
  background: url('http://www.edsys.in/wp-content/uploads/trending.gif') no-repeat bottom;
  background-position-x: 5px;
}

Answer 1

你的背景被切断了，因为它溢出了锚元素。由于锚是内联元素，因此简单地调整高度将不起作用。首先尝试将锚点设置为display: block;，例如：

.trending a {
  background: url('http://www.edsys.in/wp-content/uploads/trending.gif') no-repeat bottom;
  background-position-x: 5px;
  background-position-y: 20px;
  display: block;
  height: 100%;
}

Answer 2

.trending a {
background: url('http://www.edsys.in/wp-content/uploads/trending.gif')no-repeat 5px bottom;
height:'';
width:'';
}

菜单项的背景图像

2 个答案: