Html SMARTY：标题搜索

嘿，我有个小问题。也许有人能很快帮上忙。问题是我在我的网站上实现了这个导航条（下面的代码）。这只是一个欢迎文本和一个搜索，但搜索不会正确显示。我想要一个像Stackoverflow上的搜索一样的结果，只是在文本条目的右侧有一个图标

index.html中的代码：

{if strstr ($smarty.server.PHP_SELF, 'index')}
                <div class="{if strpos($smarty.server.PHP_SELF, 'checkout')}span12{else}span9 desk9{/if}" style="left: 0px;">
                    <div class="navbar navbar-default">
                            <div class="container">
                                <ul class="nav pull-left" >                             
                                    <li class="navbar-text"> HERZLICH WILLKOMMEN </li>
                                </ul>
                                <ul class="nav pull-right" >    
                                    <li class="navbar-search">{$box_SEARCH_HEADER}</li>
                                </ul>
                            </div>
                    </div>
                    {/if}
                </div> 

打开页面时获得的最终代码：

 <div class="navbar navbar-default">
                                <div class="container">
                                    <ul class="nav pull-left" >                             
                                        <li class="navbar-text"> HERZLICH WILLKOMMEN </li>
                                    </ul>
                                    <ul class="nav pull-right" >    
                                        <li class="navbar-search">
<!-- Orginal
<form class="navbar-search pull-right" id="quick_find_header" action="http://vorschau2.de.dedi2539.your-server.de/fitinart.com/advanced_search_result.php" method="get">
    <input type="text" name="keywords" value="Suchen" class="search-query span2" placeholder="Suchen" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" /><input type="image" src="templates/bootstrap/buttons/german/button_quick_find.gif" alt="" />   
</form>
-->

<!--Ãnderung -->
<form class="navbar-form pull-right" id="quick_find_header" action="http://vorschau2.de.dedi2539.your-server.de/fitinart.com/advanced_search_result.php" method="get">
    <input type="text" name="keywords" value="Suchen" class="span2" placeholder="Suchen" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" /><input type="image" src="templates/bootstrap/buttons/german/button_quick_find.gif" alt="" />
</form></li>
                                    </ul>
                                </div>

                        </div>

HERZLICH WILLKOMMEN

只需在文本输入中使用背景图像，在右侧添加一些填充，然后删除图像按钮。i、 e

#quick_find_header input{
  padding-right:25px;
  background:url(image.png) right center;
}

---

您可以发布浏览器中显示的最终html代码吗？我想这是一个css/html问题，php代码和smarty模板并不是真正的问题useful@Borgtex我刚刚编辑了我的帖子并发布了最终的输出

#quick_find_header input {
    background-color: #515151;
    border-color: #111111;
    color: #999;
    }
    #quick_find_header input:focus {
    box-shadow: none;
    color:#fff;
    }

 <div class="navbar navbar-default">
                                <div class="container">
                                    <ul class="nav pull-left" >                             
                                        <li class="navbar-text"> HERZLICH WILLKOMMEN </li>
                                    </ul>
                                    <ul class="nav pull-right" >    
                                        <li class="navbar-search">
<!-- Orginal
<form class="navbar-search pull-right" id="quick_find_header" action="http://vorschau2.de.dedi2539.your-server.de/fitinart.com/advanced_search_result.php" method="get">
    <input type="text" name="keywords" value="Suchen" class="search-query span2" placeholder="Suchen" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" /><input type="image" src="templates/bootstrap/buttons/german/button_quick_find.gif" alt="" />   
</form>
-->

<!--Ãnderung -->
<form class="navbar-form pull-right" id="quick_find_header" action="http://vorschau2.de.dedi2539.your-server.de/fitinart.com/advanced_search_result.php" method="get">
    <input type="text" name="keywords" value="Suchen" class="span2" placeholder="Suchen" onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;" /><input type="image" src="templates/bootstrap/buttons/german/button_quick_find.gif" alt="" />
</form></li>
                                    </ul>
                                </div>

                        </div>

#quick_find_header input{
  padding-right:25px;
  background:url(image.png) right center;
}