3

こんにちは、次のコードにどのように配置するかを知りたいです: http://jsfiddle.net/Torrecilla/Yv6zx/3/

右のこの矢印:矢印を選択

出来ますか？私はそれを理解できませんでした

<select name="cats" id="cats">
  <option value="">All the Categories</option>
  <option value="">Cat 1</option>
  <option value="">Cat 2</option>
  <option value="">...</option>
</select>​

CSS

body {
    margin-top:20px;
    margin-left:20px;
}
select {
    padding:3px;
    margin: 0;
    border-radius:4px;
    -webkit-box-shadow: 
        0 0px 0 #ccc,
        0 0px #fff inset;
    background: -moz-linear-gradient(top, #FBFBFB 0%, #E9E9E9 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFB), color-stop(100%,#E9E9E9));
    color:black;
    border:none;
    outline:none;
    display: inline-block;
    -webkit-appearance:none; 
    cursor:pointer;
    border: 1px solid #ccc;
}
4

1 に答える 1

3

はい、可能です！これを試して：

CSS：

background: url('http://i45.tinypic.com/309nb74.png') no-repeat right, -moz-linear-gradient(top, #FBFBFB 0%, #E9E9E9 100%);
background: url('http://i45.tinypic.com/309nb74.png') no-repeat right, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFB), color-stop(100%,#E9E9E9));

パディングを調整する必要がありますが、あなたはその考えを理解します。

デモ：

http://jsfiddle.net/Yv6zx/24/

于 2012-12-03T02:03:37.197 に答える