如何让我的精选Dropbox看起来漂亮？

Question

<div>
    <label for="vehicie_type">Vehicie Type:</label>
    <select id="vehicie_type">
      <option>11111</option>
      <option>22222</option>
      <option>33333</option>
    </select>
  </div>
  <div>
    <label for="cc">CC:</label>
    <select id="cc">
      <option>11111</option>
      <option>22222</option>
      <option>33333</option>
    </select>
  </div>

如何使我的选择保管箱看起来如下图所示？ 我想要的是不同侧面的文字和选择框，看起来有序。

Answer 1

既然你没有发布关于你的css的任何内容......这样的话吗？

＆＃13;

＆＃13;

label {
  width: 100px;
  text-align: right;
  display: inline-block;
  margin-top: 20px;
}
select {
  border: 2px solid #333;
  display: inline-block;
  border-radius: 5px;
  width: 200px;
  color: #ccc;
  height: 30px;
  line-height: 30px;
}

＆＃13;

<div>
  <label for="vehicie_type">Vehicie Type:</label>
  <select id="vehicie_type">
    <option>11111</option>
    <option>22222</option>
    <option>33333</option>
  </select>
</div>
<div>
  <label for="cc">CC:</label>
  <select id="cc">
    <option>11111</option>
    <option>22222</option>
    <option>33333</option>
  </select>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

这就是我提出的：

select{
    border-radius: 8px;
    border: 2px solid gray;
    height: 25px;
    color: gray;
}

<强> JSFiddle demo here