HTML Basic Tutorial

HTML media

HTML reference manual

HTML5 Basic Tutorial

HTML5 API

HTML5 Media

HTML Video (Video) Playback HTML Header Elements

HTML CSS

CSS (Cascading Style Sheets) is used to render the styles of HTML element tags.

More examples online

HTML uses styles
This example demonstrates how to use the style information added to the <head> section to format HTML.

Demonstrates how to create a link without an underline using the style attribute.
How to use the style attribute to create a link without an underline.

link to an external stylesheet
This example demonstrates how links to an external stylesheet.

How to use CSS

CSS is used in HTML 4 Started to use, it was introduced to better render HTML elements.

CSS can be added to HTML in the following ways:

Inline styles- Use the "style" attribute in the HTML element
Internal Stylesheet -Use the <style> element in the <head> area of the HTML document to include CSS
External reference - Use an external CSS file

The best way is to reference an external CSS file.

In our HTML tutorial, we use inline CSS styles to introduce examples. This is to simplify the examples and make it easier for you to edit code online and run examples online.

You can learn more through the CSS Tutorial Learn more CSS knowledge.

Inline styles

Inline styles can be used when special styles need to be applied to individual elements. The method of using inline styles is to use the style attribute in the relevant tag. The style attribute can include any CSS property. The following example shows how to change the color and left margin of a paragraph.

<p style="color:blue;margin-left:20px;">This is a paragraph.</p>

Learn more styles by visiting CSS Tutorial.

HTML style example - Background color

Background color attribute (background-Define the background color of an element with the color property:

Example

!DOCTYPE　html>
<html>
<head>　
<meta　charset="utf-8">　
<title>Basic Tutorial(oldtoolbag.com)</title>　
</head>
<body　style="background-color:yellow;">
<h2　style="background-color:red;">This is a title</h2>
<p　style="background-color:green;">This is a paragraph.</p>
</body>
</html>

Test to see if it works ‹/

Early background color attribute (background-color) is defined using the bgcolor attribute.

Test to see if it works ‹/›

Now it is usually used with font-family (font), color (color), and font-size (font size) attribute to define text style, instead of using the <font> tag.

HTML Style Example - Text alignment methods

Use text-The align (text alignment) attribute specifies the horizontal and vertical alignment of text:

Online Example

Example

!DOCTYPE　html>
<html>
<head>　
<meta　charset="utf-8">　
<title>Basic Tutorial(oldtoolbag.com)</title>　
</head>
<body>
<h1　style="text-align:center;">Center-aligned title</h1>
<p>This is a paragraph.</p>
</body>
</html>

Test to see if it works ‹/›

Text alignment attribute text-align has replaced the old tag <center>.

Internal Stylesheet

When a single file requires special styles, an internal stylesheet can be used. You can define an internal stylesheet by using the <style> tag in the <head> section:

<head>
<style　type="text/css">
body　{background-color:yellow;}
p　{color:blue;}
</style>
</head>

External Stylesheet

When styles need to be applied to many pages, an external stylesheet is an ideal choice. By using an external stylesheet, you can change the entire appearance of the site by modifying a single file.

<head>
<link　rel="stylesheet"　type="text/css"　href="mystyle.css">
</head>

HTML style tags

Tag	Description
<style>	Define text style
<link>	Define the resource reference address

Deprecated tags and attributes

In HTML 4The tags and attributes that were previously used to define HTML element styles have been deprecated. These tags will not be supported in new versions of HTML tags.

Tags that are not recommended for use include: <font>, <center>, <strike>

Attributes Not Recommended for Use: color and bgcolor.

HTML Video (Video) Playback HTML Header Elements