How do you change the style of a text box? (HTML / CSS)

Answer 1

The border CSS attribute is what I think you're looking for. See MSDN: http://msdn.microsoft.com/en-us/library/ms533532%28VS.85%29.aspx

Answer 2

Theoretically you can write a style rule like:

input[type=text] {
    border: 4px solid purple;
}

However, the [type=text] syntax is not cross-browser compatible. I generally add a text class to the input, like so;

<input type="text" class="text" name="foo" />

Then you can write a traditional CSS rule like:

input.text {
    border: 4px solid purple;
}

Of course, this assumes you want four pixel solid purple borders. Adjust accordingly.

Answer 3

The input fields in your screenshot have not actually been styled, they look like the OS defaults. Instead, the designer has opted to style the parent elements such as the form, fieldset and possible divs or lists for positioning.

This article will give you a great foundation for building prettier forms.