如何样式下拉列表?

时间:2013-07-17 13:28:39

标签: php html css forms drop-down-menu

如何将css样式添加到此表单的下拉列表中?我在互联网上搜索了很多但没有找到有用的结果。 感谢

    echo  "<form method='post' action='advisor.php?view=$view'>
    Select Student: <select name='data'>";
    while($row = mysqli_fetch_array($query))
        {

                    echo "<option value=\"".$row[3] . "\">".$row[0] ." " . $row[1] . " (".$row[3].")".
                    "</option>";
        }
      echo    " </select>
        <input type='submit' name='submit' class='buttonM' value='Show Questions' />
        </form>";
     }

2 个答案:

答案 0 :(得分:2)

检查一下 - http://bavotasan.com/2011/style-select-box-using-only-css/

HTML

<div class="styled-select">
   <select>
      <option>Here is the first option</option>
      <option>The second option</option>
   </select>
</div>

CSS

.styled-select select {
   background: transparent;
   width: 268px;
   padding: 5px;
   font-size: 16px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 34px;
   -webkit-appearance: none;
}

要获得更精细的样式,您需要使用javascript - 例如http://tympanus.net/codrops/2012/10/04/custom-drop-down-list-styling/

答案 1 :(得分:0)

如果您的意思是“如何在表单元素中设置可选选项的样式?”,那么您将会遇到困难。你不能使用纯CSS来实现这一点。你可以创建一个“

  • ”下拉菜单来实现你想要的视觉效果,但这取决于你的表格用途,真的......