How to make custom textbox?
I开发者_如何学运维 have seen many sites with many types of shaped textbox (for instance, someone has drawn it in paint and made it an HTML textbox). How are these textboxes made? I figured out that some kind of css is used but how to get that ..
Alternately you can use an image as a textbox background, which can really make things look awesome:
<style type="text/css">
input{
width:220px;
height:50px;
display:block;
background:url(images/input.png);
border: none;
}
</style>
One way is to take advantage of CSS3 like below:
<html>
<head>
<style type="text/css">
.round{
border:2px solid;
border-radius:25px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
padding:10px;
}
</style>
</head>
<body>
<textarea rows="1" cols="10" class="round">Blah blab </textarea>
</body>
</html>
In the same way, you could then add background images, more styling etc. like below. Hope that answers your question!
<html>
<head>
<style type="text/css">
.round{
border-radius:25px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
padding:10px;
background:yellow;
border: 2px dotted red;
}
</style>
</head>
<body>
<textarea rows="1" cols="10" class="round">Blah blab </textarea>
</body>
</html>
加载中,请稍侯......
精彩评论