如何隱藏在

Question

類

價值怎樣才能.fa .fa搜索類下隱藏跨度值http://prntscr.com/fr3vvk

<div role="tabpanel" class="tab-pane fade in active" id="stm_all_listing_tab"> 
       <form action="" method="GET"> 
        <button type="submit" class="heading-font"><i class="fa fa-search"></i> <span>76</span> Lorry      </button> 
        <div class="stm-filter-tab-selects filter stm-vc-ajax-filter"> 
         <div class="row"><div class="col-md-3 col-sm-6 col-xs-12 stm-select-col"><div class="stm-ajax-reloadable"><select name="condition" data-class="stm_select_overflowed" tabindex="-1" class="select2-hidden-accessible" aria-hidden="true"><option value="">Choose Condition</option><option value="new-cars">New (10) </option><option value="rebuild">Rebuild (28) </option><option value="used-cars">Second Hand (38) </option></select><span class="select2 select2-container select2-container--default" dir="ltr" style="width: 141px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-condition-w3-container"><span class="select2-selection__rendered" id="select2-condition-w3-container" title="Choose Condition">Choose Condition</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div></div><div class="col-md-3 col-sm-6 col-xs-12 stm-select-col"><div class="stm-ajax-reloadable"><select name="body" data-class="stm_select_overflowed" tabindex="-1" class="select2-hidden-accessible" aria-hidden="true"><option value="">Choose Body</option><option value="box">Box (8) </option><option value="cargo">Cargo (23) </option><option value="crane">Crane (4) </option><option value="flatbed">Flatbed (1) </option><option value="no-body">No-body (2) </option><option value="others">Others (2) </option><option value="roll-on-roll-off">Roll-on-Roll-Off (2) </option><option value="skylift">Skylift (2) </option><option value="tipper">Tipper (22) </option><option value="trailer">Trailer (10) </option></select><span class="select2 select2-container select2-container--default" dir="ltr" style="width: 144px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-body-0d-container"><span class="select2-selection__rendered" id="select2-body-0d-container" title="Choose Body">Choose Body</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div></div><div class="col-md-3 col-sm-6 col-xs-12 stm-select-col"><div class="stm-ajax-reloadable"><select name="make" data-class="stm_select_overflowed" tabindex="-1" class="select2-hidden-accessible" aria-hidden="true"><option value="">Choose Brand</option><option value="bison">Bison (0) </option><option value="daihatsu">Daihatsu (16) </option><option value="dong-feng">Dong Feng (0) </option><option value="ford">Ford (0) </option><option value="fuso">Fuso (4) </option><option value="hicom">Hicom (4) </option><option value="hino">Hino (6) </option><option value="inokom-truck">Inokom Truck (1) </option><option value="isuzu">Isuzu (11) </option><option value="jac">JAC (0) </option><option value="jbc">JBC (0) </option><option value="mazda">Mazda (3) </option><option value="mercedes-benz">Mercedes-Benz (0) </option><option value="nissan">Nissan (15) </option><option value="renault">Renault (0) </option><option value="scania">Scania (4) </option><option value="shacman">Shacman (8) </option><option value="suzuki">Suzuki (0) </option><option value="tata">Tata (0) </option><option value="toyota">Toyota (1) </option><option value="ud-trucks">UD Trucks (1) </option><option value="volvo">Volvo (2) </option></select><span class="select2 select2-container select2-container--default" dir="ltr" style="width: 145px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-make-5f-container"><span class="select2-selection__rendered" id="select2-make-5f-container" title="Choose Brand">Choose Brand</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div></div><div class="col-md-3 col-sm-6 col-xs-12 stm-select-col"><select class="stm-filter-ajax-disabled-field select2-hidden-accessible" name="max_price" data-class="stm_select_overflowed" tabindex="-1" aria-hidden="true"><option value="">Max Price</option><option value="5000">RM 5 ,000</option><option value="10000">RM 10 ,000</option><option value="15000">RM 15 ,000</option><option value="20000">RM 20 ,000</option><option value="30000">RM 30 ,000</option><option value="40000">RM 40 ,000</option><option value="50000">RM 50 ,000</option><option value="70000">RM 70 ,000</option><option value="80000">RM 80 ,000</option><option value="100000">RM 100 ,000</option></select><span class="select2 select2-container select2-container--default" dir="ltr" style="width: 105px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-max_price-sn-container"><span class="select2-selection__rendered" id="select2-max_price-sn-container" title="Max Price">Max Price</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span></div></div>      </div> 
       </form> 
      </div> 

Answer 1

這可以很容易地通過兄弟選擇有針對性和應用display: none：

.fa-search + span {display: none;} 

如果你想要的值僅僅是隱藏的，你可以使用：

.fa-search + span {visibility: hidden;} 

或者，如果你想從視圖中隱藏，但應該是複製能力，可以使用的技術，如：

.fa-search + span {width: 0px; height: 0px; display: inline-block; overflow: hidden;}