Introduction to CSS3

Introduction to CSS3

1. Introduction

Introduction

CSS (Cascading Style Sheet) is what is used to control the appearance of a web page. The HTML controls the content.

Unlike HTML, which is a tab-based mark-up language, CSS is a C-Based scripting language.

Types of CSS

CSS code can be deployed in three (3) different manners:

External (Preferred)

External CSS files are plain-text files written in CSS syntax that can be linked-to from any page within the website.

Many times, the stylesheet is located in the root folder and in some cases inside of a “styles” folder that is in the root. Typically, folders are used if more than three (3) stylesheets are being utilized in the overall site.

To link to an external stylesheet, the following code should be entered in the “head” of the HTML document:

<link href=”path to stylesheet file and filename” type=”text/css” rel=”stylesheet” />

As long as the HTML page can “see” the stylesheet, the formatting that is outlined in the stylesheet will be accessible to the HTML page.

Embedded

Embedded CSS is when CSS formatting instructions are established inside the HTML head. Unlike an external stylesheet, the embedded stylesheet (sometimes called an internal stylesheet) writes CSS syntax enclosed within <style> tags in the document head.

Example:

<head>
  <style>
    body{
      text-decoration:none:
      background-color:rgb(255,255,255);
      color:rgb(0,0,0);
      margin: 0px;
      }
  <style>
  <title>Title of the HTML Document</title>
</head>

In-Line (Least Preferred)

In-Line CSS is when CSS formatting instructions are established inside the HTML body. Typically, this is only used to format a very small portion of a document. This formatting is established utilizing the <style> tags in the document body.

Example:

<p>This is a paragraph of text. The word <style=”color:rgb(255,0,0);”>red</style> should appear in the color red.</p>