Header Ads

What is CSS

Mark C. 1:49 PM

  • What is CSS?



    -CSS is an acronym for Cascading Style Sheets.
    -Cascading refers to how CSS applies one style to another.
    - Style Sheets checks the look or design of web documents.

    CSS and HTML:
    -HTML builds the web structure.
    -CSS determines how HTML elements will appear. To understand CSS, you need to have a basic knowledge of HTML.


    • Why use CSS?



    -CSS allows you to apply specific styles to specific HTML elements. The main advantage of CSS is that it allows you to separate style from content. By simply using HTML, the style and content will be located in the same location, which makes it difficult to manage by increasing the pages of a single website. So all the style data must be moved to a special file called CSS.


    • CSS within the HTML row



    One of the ways to add style. A single style is applied within the row. We add style attributes to each HTML tag. The following example shows the construction of a background with a gray background and white text:

    <p style = "color: white; background-color: gray;">
    This is an example of adding CSS within the HTML row.
    </p>

                result:

      


    • Internal CSS



    This type of style is written using the style tag, inside the head section of the HTML page. For example, styling all HTML paragraphs. All paragraphs will have a gray background and white text:

    <Html>
    <Head>
    <Style>
    p {
    color: white;
    background-color: gray;
      }
    </Style>
    </Head>
    <Body>
    <p> This is a paragraph. </ P>
    <p> This is also a paragraph </p>
    </Body>
    </Html>
      
             result:



    • External CSS



    -With this method, all the styling rules will be kept in a single file, which will be saved with the suffix .css This CSS file is linked to HTML using the <link> tags. The <link> element is placed inside the head section. The following is an example:

    HTML file:

    <Html>
    <Head>
    <link rel = "stylesheet" href = "style.css">
    </Head>
    <Body>
    <p> This is a paragraph </p>
    <p> This is a paragraph </p>
    <p> This is a paragraph </p>
    </Body>


    • CSS file:


    p {
    color: white;
    background-color: gray;
    }

               Result:



    Both relative and absolute paths can be used to determine the href for the CSS file. In our example, the path is relative because the CSS file is in the same folder as the HTML.
Tags
Reactions

Post a Comment

0 Comments

Please do not enter any spam link in the comment box.