padding box Archives - Artificial Intelligence https://www.aiuniverse.xyz/tag/padding-box/ Exploring the universe of Intelligence Tue, 11 Apr 2023 01:51:33 +0000 en-US hourly 1 https://wordpress.org/?v=6.9.1 CSS Box Model https://www.aiuniverse.xyz/css-box-model/ https://www.aiuniverse.xyz/css-box-model/#respond Tue, 11 Apr 2023 01:51:32 +0000 https://www.aiuniverse.xyz/?p=16301 The CSS box model is a concept that describes how elements are laid out on a web page using rectangular boxes. Each box consists of four main components: content, padding, border, and margin. These components determine the size and position of an element within its container. There are four Boxes- How to create content Box?

The post CSS Box Model appeared first on Artificial Intelligence.

]]> The CSS box model is a concept that describes how elements are laid out on a web page using rectangular boxes. Each box consists of four main components: content, padding, border, and margin. These components determine the size and position of an element within its container.

There are four Boxes-

  1. Content Box
  2. Paddig Box
  3. Boarder Box
  4. Margin Box

How to create content Box?

<!DOCTYPE html>
<html lang="en">
<head>
    
    <title>CSS Box Model</title>
    <style>

        #one{
            color: red;
            background-color: yellow;
            width: 5px;

        }
        #Two{
            color: white;
            background-color: blue;
        }
    </style>
</head>
<body>
    
    <div id="one">CSS Box</div>
    <div id="two">CSS Box</div>
</body>
</html>

The post CSS Box Model appeared first on Artificial Intelligence.

]]> https://www.aiuniverse.xyz/css-box-model/feed/ 0