Learn Connecting CSS in HTML

Styling HTML with CSS

CSS stands for Cascading Style Sheets. CSS defines how HTML elements will show on display, paper, or in other media. CSS saves a lot of work. It can control the design of numerous websites simultaneously.

CSS can be added to HTML elements in 3 ways:

  • Inline – by using the style attribute in HTML elements
  • Internal – by using a “style” element in the “head” section
  • External – by using an external CSS file

Connecting CSS in HTML via Inline Way

in HTML an inline CSS is used to apply a unique style to a single HTML element.

Connecting CSS in HTML via Internal Way

In HTML an internal CSS is used to define a style for one HTML page. We use this CSS in the “style” tag and in the “head” section of the HTML document.

Connecting CSS in HTML via External Way

An external style sheet is used to define the style for many HTML pages. With an external style sheet, you can change the look of an entire website, by changing it into one CSS file. You can connect your CSS file in html with the “link” tag in the head section. but you have to save your CSS in different CSS files with exertion .css for example “style.css”. All you have to do is make two files 1st is for HTML (home.html) and 2nd is for CSS (style.css) and connect the “style.css” with “home.html”  by link tag. See the example below.

CSS Text Color Changing

The CSS color property defines the text color to be used.

CSS Font Size

The CSS font-size property defines the text size to be used.

CSS Background Color

The CSS “background-color” property defines the color of the background of any element like the body of the html document, html box, or text.

Connecting CSS Task 1 – Text Color

Connecting CSS Task 1 - Text Color

Connecting CSS Task 2 – Font Size

Connecting CSS Task 2 - Font Size

Connecting CSS Task 3 – Font Size

Connecting CSS Task 3 - Font Size

Connecting CSS Task 4 – Background color

Connecting CSS Task 4 - Background color

Take Your Free Live Demo Class Now

Enter Your DETAILS BELOW

To Get Complete Information or We Will Call You

We Will Send You the Course Fees Details In Below Number

Enter Your DETAILS BELOW

We Will Call Back You Shortly

Enter Your DETAILS BELOW

We Will Call Back You Shortly

Enter Your DETAILS BELOW

Enter Your DETAILS BELOW TO take

free demo class