What the difference between body and html?

HTML-CSS
1

it seems like i get what i want by setting it with body but with html it doesn’t work ???

        body {
            margin: 0 ; 
            padding: 0 ; 
            box-sizing: border-box ; 
        }

why this don’t work alike ???

        html{
            margin: 0 ; 
            padding: 0 ; 
            box-sizing: border-box ; 
        }
2

Many browsers give default values within body and not html. Therefore resetting those values in html usually mean nothing.

3

As per HTML rule ,The body element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc. Generally data are visible to user or reader.
whereas
The html tag tells the browser that this is an HTML document.
The html tag represents the root of an HTML document.
so basically for styling browser section you need to target body.
or
generally you can use universal selector as

*{
        margin: 0 ; 
            padding: 0 ; 
            box-sizing: border-box ; 
}

it work same way as you target in body.

1 Like
5

is there any differences between * and the body ???

6

Of course there are. The wildcard selector ( * ) selects ALL the elements in your document, including tags like html, body, p, h1, h2, h3, h4, h5, h6, form, input, button, textarea, select, option, legend, fieldset…I won’t list the entire reference, but you get the idea. Using the wildcard selector is bad practise in general, unless you use it for very few and very specific rules.

Whereas the body is a little more specific in that you’re actually selecting a tag that can be inherited from.

Check this for some more info: https://stackoverflow.com/questions/7187569/whats-the-difference-in-applying-css-to-html-body-and-the-universal-selector

1 Like
7

agree with @mslilafowler
but as you are using selective css property which has to be applied for all html tag, here you can use this wildcard selector.

1 Like
8

What is the difference between the body tag and the main tag?