0

嗨,我正在尝试更改select元素的 css,它在 Firefox 中运行良好,但在 google chrome 中不起作用。当我尝试使用 Chrome 开发人员工具时,我看到Styles/Matched CSS Rules元素下的高度已成功更改为,30px但是当我转到显示时,Computed Style但是当我单击箭头以获取更多信息时,它显示高度应该是height18px30px

#new-job select - 30px 

我是 html/css 和 chromes 开发工具的新手,但它似乎应该对我有用。这是我的代码

<div id="new-job">  
  <form accept-charset="UTF-8" action="/jobs" class="new_job" id="new_job" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="vfKmC+vnnIl/6icDIbDRfZghNR927qmEqTdB9I2OeMQ="></div>

    <div class="field">
      <label for="job_category">Category</label>
      <select id="job_category" name="job[category]"><option value=""></option>
                <option value="Bistro Card">Bistro Card</option>
                <option value="Dongle">Dongle</option>
                <option value="Return">Return</option>
                <option value="Catering">Catering</option>
                <option value="Other">Other</option></select><br><br>
    </div>
    <div class="field">
      <label for="job_location">Location</label><br>
      <input id="job_location" name="job[location]" size="30" type="text">
    </div>
    <div class="field">
      <label for="job_description">Description</label><br>
      <textarea cols="40" id="job_description" name="job[description]" rows="20"></textarea>
    </div>
    <div class="actions">
      <input class="button small radius" id="submit-job" name="commit" type="submit" value="create job">
      <a href="/jobs" class="button small radius secondary">go back</a>
      <div id="new-job-errors"> </div>
    </div>
    </form>
</div>

这是我的 CSS

#new-job {
    select {height: 30px;}
}
4

3 回答 3

6

正确的语法应该是

#new-job select {
    height: 30px;
}
于 2013-07-18T23:17:58.560 回答
0

添加一些风格在你的<select>

<select id="job_category" name="job[category]" style="height:30px;">...
于 2013-07-19T10:03:52.743 回答
0

要选择select元素,您可以使用分配的 id 或标签本身。

两者的例子都在这里 - http://jsfiddle.net/9HndG/

在你的 CSS 中,它看起来像这样:

按编号

#job_category{
    height:30px;
}

按标签

select{
    width:200px;
}

由双方

select#job_category{
    height:30px;
}
于 2013-07-19T01:06:07.253 回答