css美化input文字框實現代碼

提示：您可以先修改部分代碼再運行

<div class="demo-container"><style type="text/css">input.txtInput{background:#fff;background-repeat:no-repeat;background-position:2px center;border:1pxsolid #999;padding:2px2px 2px 20px}input.searchInput{background-image:url(/blog/upload/image/20111201074152.gif)}input.commentInput{background-image:url(/blog/upload/image/20111201074123.gif)}input.borderInput{background-image:url(/blog/upload/image/20111201074051.gif);;background-repeat:no-repeat;background-position:left top;border:1pxsolid #d5dee9;padding:3px}</style><p><label for="keyword">搜尋：</label> <input class="txtInput searchInput" id="keyword" name="keyword" type="text" /></p><p><label for="comment">評論：</label> <input class="txtInput commentInput" id="comment" name="comment" type="text" /></p><p><label for="background">邊框：</label> <input class="borderInput" id="border" name="border" type="text" /></p></div></td> </tr></table>

提示：您可以先修改部分代碼再運行