Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML][PHP]Jak ustawić style dla pól formularza
Forum PHP.pl > Forum > Przedszkole
julieta
Witam

Mam kłopot z ustawieniem stylów css dla pewnych pól formularza chciałabym zmienić wygląd pól formularzy wyszukiwarki na stronie.
Jest coś takiego

  1.  
  2. <div id="quick_search_content">
  3. <div id="quick_search">
  4. <form name="qsearch" id="qsearch" method="post" action="{$live_site}/listings.php">
  5. {$lng.search.search_for}&nbsp;
  6. <input type="text" id="qs_keyword" name="qs_{$keyword_name}" size="35" />
  7. &nbsp;{$lng.general.in}&nbsp;
  8. <select id="qs_category" name="qs_category" onchange="onQuickSearch(this.form, '{$live_site}'); {if $multi_depending}reloadDep('{$multi_depending}', '{$live_site}');{/if}">
  9. <option value="">{$lng.search.all_categories}</option>
  10. {foreach from=$categories item=v name=cat}
  11. <option value="{$v.id}"{if $v.parent} class="opt_parent"{/if}{* {if $cat==$v.id && $self_noext=="listings"}selected="selected"{/if}*}>{$v.str}{$v.name|escape:"html"}</option>
  12. {/foreach}
  13. </select><br/>
  14.  
  15.  
  16. {foreach from=$qfields item=v name=custom}
  17.  
  18. {if $v.caption=="zip" && in_array("areasearch",$modules_array)}
  19.  
  20.  
  21.  
  22. {elseif $v.type=="depending"}
  23. <li {if $v.fieldset!=0} id="li_{$v.depending.caption1}" style="display: none"{/if}>
  24. <div>
  25. <label>{$v.depending.name1}</label><br/>
  26. <select name="qs_{$v.depending.caption1}" id="qs_{$v.depending.caption1}" {if $multi_depending && in_array($v.dep_id, ','|explode:$multi_depending)}disabled="disabled"{/if} onchange="selDepending(1, 'qs_{$v.depending.caption1}', 'qs_{$v.depending.caption2}', '{$v.depending.id}', {if $multi_depending && in_array($v.dep_id, ','|explode:$multi_depending)}this.form.qs_category.value{else}0{/if}, 0, '', '{$live_site}' )">
  27. <option value="">{$v.depending.top_str1}</option>
  28. {foreach from=$v.depending.elements item=t}
  29. <option value="{$t.name}">{$t.name|escape:"html"}</option>
  30. {/foreach}
  31. </select>
  32. </div>
  33. </li>
  34. <li {if $v.fieldset!=0} id="li_{$v.depending.caption2}" style="display: none"{/if}>
  35. <div>
  36. <label>{$v.depending.name2}</label><br/>
  37. <span><select disabled='disabled' name="qs_{$v.depending.caption2}" id="qs_{$v.depending.caption2}"
  38. {if $v.depending.no>=3}onchange="selDepending(2, 'qs_{$v.depending.caption2}', 'qs_{$v.depending.caption3}', '{$v.depending.id}', 0, 0, '' , '{$live_site}')"{/if}>
  39. <option value="">{$v.depending.top_str2}</option>
  40. </select></span>
  41. </div>
  42. {if $v.depending.no>=3}
  43. </li>
  44.  
  45. <li {if $v.fieldset!=0} id="li_{$v.depending.caption4}" style="display: none"{/if}>
  46. <div>
  47. </span>
  48. </div>
  49. {/if}
  50.  
  51. </li>
  52.  
  53. {else}
  54.  
  55. {if $v.type=="textbox" || $v.type=="url" || $v.type=="email" || ($v.type=="price" && $ads_settings.enable_price) || !in_array($v.type, $default_fields_types) }
  56. <li {if $v.fieldset!=0} id="li_{$v.caption}{if $v.search_type==2}_low{/if}" style="display: none"{/if}>
  57. <div>
  58. <label>{$v.name}</label><br/>
  59. {if $v.prefix!=""} {$v.prefix} {/if}
  60.  
  61. {if $v.type=="price" && $appearance.currency_pos==0}
  62. {if $currencies|@count>1}
  63. <select name="qs_currency">
  64. <option value="">-</option>
  65. {foreach from=$currencies item=i}
  66. <option value="{$v.currency}">{$i.currency|escape:"html"}</option>
  67. {/foreach}
  68. </select>
  69. {else} {$currencies[0].currency}
  70. {/if}
  71. {/if}
  72.  
  73. {if $v.search_type==2}
  74.  
  75. {if $v.is_numeric && $v.search_elements}
  76. <select id="qs_{$v.caption}_low" name="qs_{$v.caption}_low">
  77. <option value="">- {$lng.general.min} -</option>
  78. {foreach from=$v.search_elements_array item=t}
  79. <option value="{$t|replace:',':''|replace:'.':''}">{$t}</option>
  80. {/foreach}
  81. </select>
  82. </div>
  83. </li>
  84. <li {if $v.fieldset!=0} id="li_{$v.caption}_high" style="display: none"{/if}>
  85. <div>
  86. <label></label><br/>
  87. <select id="qs_{$v.caption}_high" name="qs_{$v.caption}_high">
  88. <option value="">- {$lng.general.max} -</option>
  89. {foreach from=$v.search_elements_array item=t}
  90. <option value="{$t|replace:',':''|replace:'.':''}">{$t}</option>
  91. {/foreach}
  92. </select>
  93. {else}
  94.  
  95. {/if}
  96.  
  97. {else}
  98.  
  99.  
  100. {/if}
  101.  
  102. {if $v.postfix!=""} {$v.postfix} {/if}
  103. {if $v.type=="price" && $appearance.currency_pos==1}
  104. {if $currencies|@count>1}
  105.  
  106. {else} {$currencies[0].currency}
  107. {/if}
  108. {/if}
  109. </div>
  110. </li>
  111.  
  112. {elseif $v.type=="menu"}
  113. <li {if $v.fieldset!=0} id="li_{$v.caption}{if $v.search_type==2}_low{/if}"{/if}>
  114. <div>
  115.  
  116. {if $v.prefix!=""} {$v.prefix} {/if}
  117. {if $v.search_type==2}
  118.  
  119.  
  120. </div>
  121. </li>
  122. <li {if $v.fieldset!=0} id="li_{$v.caption}_high" style="display: none"{/if}>
  123. <div>
  124.  
  125.  
  126. {else}
  127.  
  128. {/if}
  129.  
  130. {if $v.postfix!=""} {$v.postfix} {/if}
  131. </div>
  132. </li>
  133.  
  134.  
  135. {/if}
  136.  
  137. {/if}
  138.  
  139. {/foreach}
  140.  
  141.  
  142. <input type="hidden" name="order" value="date_added" />
  143. <input type="hidden" name="order_way" value="desc" />
  144.  
  145. <div class="search-button" style="display: inline;"><strong><input type="submit" name="Search" value="{$lng.general.search}" /></strong></div>
  146.  
  147. {if $qfields|@count && $self_noext!="index"}&nbsp;<span id="span_more_options"><a id="more_options" href="java script:;">{$lng.general.more_options}</a></span><span id="span_less_options" style="display: none;"><a id="less_options" href="java script:;">{$lng.general.less_options}</a></span>
  148.  
  149. {/if}
  150. <br/>
  151. {if $qfields|@count}
  152.  
  153. {/if}
  154. </form>
  155. </div>
  156.  
  157. </div>
  158.  
  159.  


Dla pola
select id="qs_category" name="qs_category"
potrafię nadać css


  1. #quick_search_content #quick_search #qs_category
  2. {
  3. -webkit-appearance: none;
  4. -moz-appearance: none !important;
  5. vertical-align: top;
  6. width: 280px;
  7. height: 38px;
  8. padding: 8px 10px;
  9. margin: 0 0 0 8px;
  10. color: #993333;
  11. background-attachment: scroll;
  12. background-color: #C9C994;background-repeat: no-repeat;
  13. background-position: right center;
  14. border: 1px solid #6A6A35;
  15. font-family: Verdana, Geneva, sans-serif;
  16. font-size: 14px;
  17. }
  18.  


Nie potrafię niestety tego samego zrobić dla
select name="qs_{$v.depending.caption1}"id="qs_{$v.depending.caption1}"
Niestety jest tu dużo kodu php na którym się nie znam. Potrzebuje tylko tej nie wielkiej zmiany. Skrypt ten to ogłoszeniowy cms, niestety support wydawcy nie udziela żadnego wsparcia. Czy może ktoś pomóc jak dokonać tych zmian
CuteOne
Nadaj temu elementowi klasę np.

  1. <select id="jakis_id" class="klasa_select"></select>


  1. .klasa_select {
  2.  
  3. background: #000;
  4. }


Klasy w przeciwieństwie do id, mogą występować w wielu elementach (id musi być unikalne) tak więc nic nie stoi na przeszkodzie aby kilka selectów posiadało taką samą klasę
julieta
Udało się biggrin.gif Dziekuję Ci bardzo za pomoc,
pozdrawiam
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.