html - list-style-image + Select box，让Select box顶对齐

Question

当我尝试做 list-style-image和一个 select盒子里面<li> , select框在底部垂直对齐，但 list-style-image在顶部垂直对齐。如何制作 select框也在顶部对齐？

出现了 select盒子里装着一个 margin-top:5px我试图摆脱它，但即使我将它设置为 0，它仍然存在。

CSS:

  li { 
    list-style-image:url(image1.jpg); 
    vertical-align:text-top;
  }

  select { margin-top:0; }

HTML:

 <li>
  <select>
    <option>1</option>
  </select>
 </li>

Answer 1

切勿使用 list-style-image。相反，使用填充和 CSS 背景。这是您可以正确控制图像位置的唯一方法。

类似于:

li {
  background-image:url(BulletCheck.png); 
  background-repeat:no-repeat; 
  padding-left:30px; 
  margin-left:-30px;
}

请参阅我的教程:http://preview.moveable.com/JM/ilovelists/