Shulou(Shulou.com)06/01 Report--

Xiaobian to share with you how css in the text box set clear button, I hope you have read this article after harvest, let us discuss it together!

Let's first look at a specific example of setting the clear button

code is as follows

HTML code

CSS code

style.css

.searchFrame{

position:relative;

display:inline-block;

}

.inputBox{

padding-right:20px;

width:120px;

}

.searchFrame.clearButton{

width:13px;

height:13px;

position:absolute;

right:2px;

top:1px;

background:url(img/d.jpg)no-repeatleftcenter;

cursor:pointer;

}

description

In the above code, prepare a "searchFrame" frame around the text box. Place the Clear button at the right end of the searchFrame frame. Place the stylesheet on the right by setting its correct properties. The "searchFrame" frame is designated "display: inline-block," which is a frame that tightly surrounds the text box.

After reading this article, I believe you have a certain understanding of "how to set the clear button in the text box of css". If you want to know more about this knowledge, please pay attention to the industry information channel. Thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.