Sunday, May 22, 2022

Custom Html Search Box in blogger or website

 <style type="text/css">

#searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZDF3UDu2x5SmRpjD9b5VETrMMRZdiplzU5-bCyaLj57CkO8T4WV1lYQuAFRNZ49GUWHXHXH66NOKFwAFZUxdUnvzISka7CGX8XSyV2rfC5kChr1677wDDzEYx7ST5TmMJqEMfi7Q6Rh_k/s1600/searchbar.png) no-repeat;width:208px;height:29px}input:focus::-webkit-input-placeholder{color:transparent}input:focus:-moz-placeholder{color:transparent}input:focus::-moz-placeholder{color:transparent}#searchbox input{outline:none}#searchbox input[type="text"]{background:transparent;margin:3px 0 0 20px;padding:5px 0;border-width:0;font-family:"Arial Narrow",Arial,sans-serif;font-size:12px;color:#828282;width:70%;display:inline-table;vertical-align:top}#button-submit{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG23gfRXTIvODLUK0SHKZpA0NJTfTNHFt8h9eKbfrdtHlsIu4IaTJptz7ZZ-aUAuLtOhiByJRENJysc5KE1CTgQ_u6b_RofK8jQz9Hh8IOqLKznGPpxe1m5V3Z6a_5vPwXO3sAb1R5L5x1/s1600/magnifier.png) no-repeat;border-width:0;cursor:pointer;margin-left:10px;margin-top:4px;width:21px;height:22px}#button-submit:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyopHnot7Y3d8GOH8RNCzX_alzACtOVUa2pTPPSks54oMRFT8wQpyxiG87J3KdO2D_PLN2KG_v03mob9lTTHw9zBZvvSQejB19VsGya3oI2p1YZJQL5cvVIAMWErp44rs0xEGTyTQbFYGv/s1600/magnifier-hover.png) no-repeat}#button-submit:active{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyopHnot7Y3d8GOH8RNCzX_alzACtOVUa2pTPPSks54oMRFT8wQpyxiG87J3KdO2D_PLN2KG_v03mob9lTTHw9zBZvvSQejB19VsGya3oI2p1YZJQL5cvVIAMWErp44rs0xEGTyTQbFYGv/s1600/magnifier-hover.png) no-repeat;outline:none}#button-submit::-moz-focus-inner{border:0}

</style>

<form id="searchbox" method="get" action="/search" autocomplete="off"><input name="q" type="text" size="15" placeholder="search..." /><input id="button-submit" type="submit" value="" /></form>

No comments:

Post a Comment