tyczj
tyczj

Reputation: 73753

Change look of TextBox control

Is there a way I can change the appearance of a TextBox from its default look to look like this

enter image description here

I searched for creating a custom TextBox but didnt see anything about changing how it looked.

I have the have the image in a PSD i just didnt know if there was a way to replace the default look with this image

I am new to making websites and just using this for learning purposes so I dont really know where to start

Upvotes: 0

Views: 3073

Answers (4)

Konrad Gadzina
Konrad Gadzina

Reputation: 3404

You should use CSS to achieve this. What you need to do is to style it. Here are some nice examples that could help you.

Here is the one that shows how to add background image:

.tb11 {
    background:#FFFFFF url(images/search.png) no-repeat 4px 4px;
    padding:4px 4px 4px 22px;
    border:1px solid #CCCCCC;
    width:230px;
    height:18px;
}

Upvotes: 1

Khan
Khan

Reputation: 18152

An asp.net TextBox is really just an input with the type="text".

You can do something like this using stylesheets:

CSS:

input[type=text].styled1
{
    background: url(http://myUrl.com/Username.jpg);
    border:0;
    color: gray;
    height: 23px;
    padding-left:10px;
    width: 200px;
}

XHTML:

<asp:Textbox id="txtUsername" runat="server" CssClass="styled1" />

Upvotes: 0

Beaver21
Beaver21

Reputation: 1676

If you want an easy way to do it, just load easy to use bootstrap framework and include the needed file to your project.

Than just add the right class to your control and here it is !

Also, the docs is really complete and simple

http://getbootstrap.com/components/#input-groups

Upvotes: 0

Himanshu Kumar
Himanshu Kumar

Reputation: 571

You can create a custom asp.net text box control and wrap oob asp.net text box with necessary html (a label or span) and css to style it like the way you want. That control will become reusable and you would be able to use it on any of your pages.

Upvotes: 0

Related Questions