CSS将href标题置于UL列表中的图像下

Question

我正在使用this宝丽来画廊css效果。我做了一些修改，并希望从href中添加标题作为主图像下的图像标题。此时我只能在＆lt;右侧添加此标题。利取代。我想把它放在下面。这是我用来获取标题的代码：

 #gallery li a:after {
  bottom: 0; 
  content: attr(title);
}

查看我的jsfiddle以获取更多信息！

Answer 1

在display: block。

中添加#gallery li a:after

#gallery li a:after {
  bottom: 0;
  content: attr(title);  
  display: block
}

Answer 2

只需在以下样式中添加display: block：

#gallery li a:after {
  content: attr(title);
  display: block;
}

它将使:after伪元素表现得像块级元素，并且块级元素默认始终从新行开始。

更新了Fiddle：

Answer 3

将元素的位置设置为position: absolute。

所以最后一段代码看起来像这样：

#gallery li a:after {
  position: absolute;
  bottom: 10px;
  left: 10px;
  content: attr(title);
}

结果如下：

你当然可以按照你想要的方式玩这个位置。