Warum wird dieses CSS nicht wirksam?

Question

Ich benutze einen Selektor in meinem HTML, wenn ich den Stil in HTML einstellen, sieht es normal aus.

<div class="input-group" style="margin-bottom: 10px;margin-top: 0px"> 
    <input type="text" class="form-control" id="search" value="{{ search_word }}" style="height: 30px " onkeydown="entersearch()" placeholder="Enter to search..."> 
     <div class="input-group-btn" style="font-size: x-small"> 
      <!--<select id="idsel" class="form-control select-input" >--> 
       <option value="campaignid">campaignid</option> 
       <option value="vender" >vender</option> 
       <option value="pkgname" >package</option> 
      </select> 
     </div> 
</div> 

Aber wenn ich es änderte den Stil in CSS zu setzen, dauert es keine Wirkung ...

<div class="input-group" style="margin-bottom: 10px;margin-top: 0px"> 
    <input type="text" class="form-control" id="search" value="{{ search_word }}" style="height: 30px " onkeydown="entersearch()" placeholder="Enter to search..."> 
     <div class="input-group-btn" style="font-size: x-small"> 
      <select id="idsel" class="form-control select-input-gp" > 
       <option value="campaignid">campaignid</option> 
       <option value="vender" >vender</option> 
       <option value="pkgname" >package</option> 
      </select> 
     </div> 

<script type="text/css"> 
    .select-input-gp{ 
     height: 30px; 
     width: 200px; 
     color:#fff; 
     background-color:#337ab7; 
     border-color:#2e6da4; 
    } 
</script> 

Es ist seltsam. Kann mir jemand einen Führer geben?

Answer 1

Statt <script type='text/css'> Verwendung <style type='text/css'>

In Ihrem Fall der ganze Stil Code wäre dies:

<style type="text/css"> 
    .select-input-gp { 
     height: 30px; 
     width: 200px; 
     color: #fff; 
     background-color: #337ab7; 
     border-color: #2e6da4; 
    } 
</style> 

Answer 2

Sie benötigen keine <script> Tag benötigen, wie Sie nicht ein Skript verweisen; Sie referenzieren einen Stil, also müssen Sie ihn durch einen <style> Umbau ersetzen.

Das <style>-Tag sollte in der Ihres HTML deklariert werden, siehe here für mehr.