Shine Tutorial    
  shinetutorialtopsideimage
HOME DOS OS C,C++ HTML CSS XML JAVA ASP PHP SQL OFFICE MULTIMEDIA MORE... CERTIFICATION ABOUT
 
S T ADVT
TUTORIALS


 

HTML Styles

« Previous Next Chapter »

The style attribute is a new HTML attribute. It introduces CSS to HTML.


Look! Styles and colors

This text is in Verdana and red

This text is in Times and Black

This text is 30 pixels high

Try it yourself


The HTML Style Attribute

The purpose of the style attribute is:

To provide a common way to style all HTML elements.

Styles was introduced with HTML 4, as the new and preferred way to style HTML elements. With HTML styles, styles can be added to HTML elements directly by using the style attribute, or indirectly in separate style sheets (CSS files).

In our HTML tutorial we use the style attribute to introduce you to HTML styles.


HTML Style Examples

style="background-color:Black"

style="font-size:12px"

style="font-family: Times New Roman"

style="text-align:center"


Deprecated Tags and Attributes

In HTML 4, some tags and attributes are defined as deprecated. Deprecated means that they will not be supported in future versions of HTML and XHTML.

The message is clear: Avoid the use of deprecated tags and attributes.

These tags and attributes should be avoided:

Tags Description
<center> Defines centered content
<font> and <basefont> Defines HTML fonts
<s> and <strike> Defines strikeout text
<u> Defines underlined text
Attributes Description
align Defines the alignment of text
bgcolor Defines the background color
color Defines the text color

For all the above: Use styles instead.


Style Examples:


Background Color

<body style="background-color:yellow">

The style attribute defines a style for the <body> element.

Try it : Background color

The new style attribute makes the "old" bgcolor attribute obsolete.

Try it : Background the old way


Font Family, Color and Size

<p style="font-family:courier new; color:red; font-size:20px">

The style attribute defines a style for the <p> element.

Try it: Font Example

The new style attribute makes the old <font> tag obsolete.

Try it : Fonts the old way


Text Alignment

<h1 style="text-align:center">

The style attribute defines a style for the <h1> element.

Try it : Centered heading

The new style attribute makes the old "align" attribute obsolete.

Try it : Centered heading the old way


« Previous Next Chapter »