How can I create a Text field that has a transparent or no background, no top,left and right border?
I am only using CSS and HTML.
We can specify the no border property using CSS border: none, border-width : 0, border : 0 properties. Approach 1: We will give border-color, border-style properties to both headings, for showing text with border and no-border. For no border heading, we will use the border-width : 0 which will result in no border.
Probably a duplicate of this post: A customized input text box in html/html5
input {
border: 0;
outline: 0;
background: transparent;
border-bottom: 1px solid black;
}
<input></input>
See this JSFiddle
input[type="text"] {
border: 0;
border-bottom: 1px solid red;
outline: 0;
}
<form>
<input type="text" value="See! ONLY BOTTOM BORDER!" />
</form>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With