Showing posts with label css margin property. Show all posts
Showing posts with label css margin property. Show all posts

Tuesday, February 20, 2024

CSS Box margin property

    CSS Box Model -Margin Property


 1] css box model is a fundamental concept in web design that describes                                                         how elements on a webpage

 2] css box model consists of components including content, margin, border, padding .

  CSS box model explain


 1] Margin :-

             1] Margin property is use create space around html element.

            2]  Margin property CSS  individual sides top, right, bottom, left   

                                     Margin 

              1] Margin-top :-    used space to set left margin  element.

              2]  Margin-right :- use space to set left margin  element.

              3] Margin-left :- used space to set left margin of element.

             4] Margin-bottom :-  used space to set bottom margin element.

CSS Box Model -Margin

Example :-

<!DOCTYPE html>
<html>
<head>
    <title> css box model "margin"</title>
<style>
    h3
    {
        background-color: rgb(0, 255, 110);
        color: rgb(212, 48, 19);
    }
    .main
    {
        margin-left:100px;
        margin-right:100px;
        margin-top:52px;
        margin-bottom:52px;
        color:blue;
    }
    </style>
</head>
<body>
    <h3>css box model :- css Margin property<br>(margin-top ,
margin-left, margin-right, margin-bottom )</h3>
     <p class="main">Learn for the https://webdesigningtheory.blogspot.com/ </p>
</body>
</html>

CSS Box Model -Margin :-

Output:-

CSS Box Model -Margin /output





READ MORE

css button style

css class selector

css id selector

CSS Class Selector

css-text-properties

External CSS

CSS button

CSS inline block

CSS Border Property

css element selector