CSS for beginners

therk tutorial

What is CSS?

CSS is required to beautify HTML web pages, CSS stands for cascading style sheets, we can handle web pages layout, resolution in Html using CSS.

CSS syntax.

CSS syntax is the combination of selectors and declaration example is below:

h1{color:red}

here h1 is a selector and inside curly braces, the key-value pair is called a declaration.

How many types we can write CSS?

We can write three types of CSS in Html

  1. Inline CSS
  2. Internal CSS
  3. External CSS

Inline CSS

Inline CSS written inside Html tags with style attribute example is below

<h1 style="color:red">Hellow world</h1>

Internal css

Internal CSS written in the head tag of Html page example is below

<html lang="en">

<head>

    <meta charset="UTF-8"></meta>

    <meta content="IE=edge" http-equiv="X-UA-Compatible"></meta>

    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>

    <title>Document</title>

    <style>

        h1{

          color:red;

          font-size: 14px;

        }

    </style>

</head>

<body>

</body>

</html>


Extrenal CSS

External CSS written in external file with CSS extension like "style.css" and this URL passed in HTML file in link tag example is below

<html lang="en">

<head>

    <meta charset="UTF-8"></meta>

    <meta content="IE=edge" http-equiv="X-UA-Compatible"></meta>

    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>

    <title>Document</title>

    <link rel="stylesheet" href="./assets/css/style.css">

</head>

<body>

</body>

</html>

CSS FAQ

What is css in HTML? | What do you mean by CSS?

CSS used in HTML to beautify the HTML page.

What is CSS used for? | What does CSS mean?

CSS is used for beautifying the HTML Css men's cascading style sheet.

What Are REM and EM in CSS?

rem: a CSS unit that is relative to the font size of the Html element. 

em: a CSS unit that is relative to the font size of the parent element

what is bootstrap CDN?

Bootstrap provides a style sheet file that can be used directly from their server no need to download and add in our project

Bootstrap CDN example: 

"https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
Tags