[6][A.Thông điệp][slider-top-big][nothing]
You are here: Home / , Code search trong blogspot.

Code search trong blogspot.

| 1 Comment
Chào mọi người. Hôm nay mình xin giới thiệu với mọi người một số form search mẫu cho blog của bạn.



Đây là code style của form search trong Web mình - sẽ như thế này:
 <form action='/search' id='searchthis' method='get' style='DISPLAY: inline'>
                    <div style='float:left; height:25px;padding-top:8px;'>
                      <div style='background:white; border-style:none; border-radius:10px'>
                        <input id='search-box' name='q' size='25' style='padding-left:10px; color:#e0e0e0; border-style:none; width:194px; height:20px;border-radius:9px; position:relative; z-index:0; font-family:Verdana; font-weight:normal; font-size:11px' value='Search'/>
                        <input class='search_box_submit' src='http://a.wattpad.net/image/21637/v2/searchicon.png' style='position:absolute;z-index:1; margin-left:178px; margin-top:-18px; outline:none;' type='image'/>
                      </div>
                    </div>
                  </form>
Bạn cũng có thể tùy biến cho một form search như ý muốn.
Nếu không bạn có thể tham khảo một số form khác dưới đây (nếu bạn không muốn có bo góc tròn. Trong code bạn bỏ hết border-radius đi).



Code: <form action='/search' id='searchthis' method='get' style='display: inline'>
        <div style='float: left; height: 25px; padding-top: 8px;'>
            <div style='background: white; border-style: none; border-radius: 10px'>
                <input id='search-box' name='q' size='25' style='padding-left: 10px; color: #e0e0e0;
                    border-style: none; width: 194px; height: 20px; border-radius: 9px; position: relative;
                    z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px' value='Search in erhay' />
                <input class='search_box_submit' src='http://a.wattpad.net/image/21637/v2/searchicon.png'
                    style='position: absolute; z-index: 1; margin-left: 178px; margin-top: -18px;
                    outline: none;' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none;'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 0px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOm5DyJOp63kWIVtAqwLJ3IpJJYyII3WrDS38mWDdvcFvVQN7ApBWCwV76vPAAQadrzQXueVuWngFSEnTl1f1h-4s5LbxahKvH4V_cOkBWNk4pVwShHwVlsW9KRmbUE0K0o1gp0YJC-pE/s256/338368109802880074.png'
                    style='width: 25px; height: 25px; position: absolute; z-index: 1; margin-left: 178px;
                    margin-top: -24px; outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code: <form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvAkYm4EWz0AI7eIe-fdK-1pz1_BGoZKLwa-ur4BYaPckrQzFc8jMY7xx80DykJ9HHkMVZY7zyD5TiRcvZ2xioDzmtHOOotw4zD1lhkwigLv-xL4uKy_MLPTZBS-b7kWFsFAjc1QTfUL0/s256/Search+%285%29.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGboL9ltwsBBQzowoA-pyMq2DJ4riKkoMy23rNp4B3TjOIbFDuGtVoqesq2_gepNCoPlRtak6jATGkgNRAHQzRmnVbfChgOwo0pxaDPxiYla1LeooB2rDqWJng9oyQOIGEaQpJmaWEWXM/s256/Search.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSMhAQ4GdWiR-Wr8xgq02ulKZ4PR84kmHlEPi3P7YLV0RBF3G9GoV40ydbcwixKAV8-aXQ-O5NrybKHTcs-Zzn4Sxej2BGc_VNmlqstJEuDUXiXcTYrPlhZbTtJ1RqxVHnd7_OVWbyqJk/s306/big_search_icon.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkHun1JfONAwSS-8gN5IR42bnqkhZn68IxnrG3Jp4YDwJVOqeyTlZ9XJom9RfIPbBxIkwLT6lolykwJ-NGdsdiX7VFil0WI6NurBGDL0mmXJCssrNDlxKw4OhWgz88mu0Bx1ZyUIC2W48/s512/search+%283%29.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic_sI1ttoIC2CgkkNM-OILvj1pyVMjJjF3pCeo4GjncN4jodL06cVMtMnySq8mTLIXtjR1M-ZObR-unbNd_kQ5ZzWmsinZJeFfltyYlHh0CMeiHpIHG31av91Dc1axJHX0wuc1dgvkK6c/s256/search-91.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizv88EpiJyaDPx9OiLKanrQsdzW6WzXy8OzUZ9VOZbjOpMfXAe0U2SjTljLBQxoFSc2lgFbsxazitRrpxXulevsGG77G_5nmA95tup58L4pOJlGdQWRNHw3yvXyIVE4Mr2S3D5m9oqr84/s545/search-icon-marine-hi.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code: <form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_Sx80LSMWReR2YLQCpuc1EPyCSwCLHJ9SmfWb6q4VWgQhu2EUpuDejKvBSISg7BcS3y865SJSdT2vpCxxj3nI-6uwyAiaXdbfsh5BO0ZuFKDWQK-x3Tasym95sbtfaXDeEqRU9ERfbvM/s298/search-icon-md.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>

Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9mNcpEOywaMUOefqT9LlOFsTJyMr6Kr1bOGN4bbVurMOj3-p-VAt0lP1UFiF8C1Lnn-90ltoI7Psil_oxrQZYJazSXjTHMpHN5zxx8u1cSSW9go5CAYzMGjCQD9g8mykyVBjVCzsADvk/s298/search-icon-red-md.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>


Code:<form action='/search' id='searchthis' method='get' style='display: inline; border: 1px solid #eeeeee'>
        <div style='float: left; height: 35px; padding-top: 8px;'>
            <div style='border: 1px solid #eeeeee; background: white; border-style: none; border-radius: 10px;
                overflow: hidden'>
                <input id='search-box' name='q' size='35' style='border-right: 1px solid #eee; padding-left: 10px;
                    color: #e0e0e0; border-style: none; width: 194px; height: 25px; border-radius: 9px;
                    position: relative; z-index: 0; font-family: Verdana; font-weight: normal; font-size: 11px'
                    value='Search in erhay' />
                <input class='search_box_submit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7jjM83impfLvwzHjXpnZPg8zJcg7FEXPJ8vg47O8MixOaSixUKJCiPQR7em3E8UbrVwjTrTgI4aGCoCeP1yGJS9tpsiAjyxLxltQBf5V3NbfsIxqpN25cYJsR-AHdSeCFzXSIuF-H56s/s200/search-icon.png'
                    style='border-top-right-radius: 10px; border-bottom-right-radius: 10px; width: 25px;
                    height: 25px; position: absolute; z-index: 1; margin-left: 178px; margin-top: -25px;
                    outline: none; border-left: 1px solid #eeeeee' type='image' />
            </div>
        </div>
        </form>

Related Posts
  • Default comments
  • Facebook comments
Subscribe to: Post Comments ( Atom )