How css sets the clear button in the text box
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!