[百度搜索框Bootstrap模仿]

[百度搜索框Bootstrap模仿]_第1张图片


<html>
    <head>
        <meta charset="utf-8">
        <title>百度搜索框提示功能title>
        
        <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
        <style>
            /*这里修改提示框的字体样式*/
            .bdSug_wpr {
                color: black;
            }
        style>
    head>

    <body>
        
        <form action="http://www.baidu.com/baidu" target="_blank">
                
                <div class="form-inline input-group">
                    
                    <input name=ie type=HIDDEN value=utf-8/>
                    <input name=tn type=HIDDEN value=baidu/>
                
                    <span class="input-group-btn">
                        
                        <input id="kw" type="text" class="form-control" placeholder="搜你想搜的" name="word" size="30" baiduSug="1" style="width:240px;">
                       
                        <input type="submit"  class="btn btn-default"  value="百度一下"/>
                    span>
                div>
        form>
        body>
        
        <script charset="gbk" src="http://www.baidu.com/js/opensug.js">script>
        
        <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js">script>
        
        <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js">script>
html>

你可能感兴趣的:([百度搜索框Bootstrap模仿])