Question

我有导航div，有按钮例如只有img没有链接，我想在蚂蚁之后这个图像添加行：我试试：

#nav{                   
    height: 50px;
    width: auto;
    margin: 0 auto;
    margin-top: 30px;
    padding: 0;}

#nav ul li img{
    padding: 0; margin: 0;}

html：

<li><img src="./img/dot.gif" alt=""/></li>

我添加到css这个代码添加后和bofore图像行：

#nav ul li img:before{
  background: url('./img/orange-pixel.gif') repeat-x 50% 50%; 
  width: 40px; 
  height: 3px; 
  float: left; 
  padding-top: 45px;} 
#nav ul li img:after{
  background: url('./img/orange-pixel.gif') repeat-x 50% 50%; 
  width: 40px; 
  height: 3px; 
  float: left; 
  padding-top: 45px;}

但不显示行。

Answer 1

根据this帖子，大多数浏览器都不会为:before标记计算:after / img。无论如何要帮助你：为什么不通过为图像添加边框来设置线条。或者在:before代码上使用:after / li？

Answer 2

你可以添加

content:".";
text-indent:-9999em;
display:block

到你的：之前和之后：后。所有这一切都是为了“抓住”它应该有效。

如果它们是基本线，为什么不在李的一边添加边框呢？：之前和之后：在旧版浏览器中不起作用，因此如果有必要，这是一种更加一致的体验。

html之前标签不能正常工作

2 个答案: