html common block elements inline (inner line) element instructions (a)

html usually common block element has: div, p, h1, h2, h3, etc., have inline elements: span, a, img like.

Properties of block elements: no matter what the content will monopolize an entire row. Mainly used for page layout.

Properties inline elements: only the size of the element itself, not occupy his party. The main setting for the selected text style.

div block elements only just for page layout, its own without any default style.

span inline style text element can be used to select the text, which does not itself with default style.

Generally, only the block element contains inline elements, instead of using the inline element to include the block elements.

a element can contain any elements, in addition to its own.

p elements can not contain any block elements.

Div block elements of: < br > 
    < div style = "background-Color: BlueViolet" > div alas Calls Xi, almost high risk indeed! Shudao difficult, extremely difficult! Cong and Yufu, founding what a loss! </ Div > 
    < div style = "background-Color: Blue" > div alas Calls Xi, almost high risk indeed! Shudao difficult, extremely difficult! Cong and Yufu, founding what a loss! </ Div > 
    < div style = "background-Color: Chartreuse" > div alas Calls Xi, almost high risk indeed! Shudao difficult, extremely difficult! Cong and Yufu, founding what a loss! </ Div > 
    < div style = "background-Color: Chocolate; width: 300px by;" > div width = 300px alas Calls Xi, almost high-risk zai! Shudao difficult, extremely difficult! Cong and Yufu, founding what a loss! </div > 
    < div style = "background-Color: Blue; width: 500px;" > div width = 500px alas Calls Xi, almost high risk indeed! Shudao difficult, extremely difficult! Cong and Yufu, founding what a loss! </ Div > 
    the p-block elements of: < br > 
    < the p- style = "background-Color: Blue" > the p-Seoul to forty-eight thousand thousand years, with no signs of human habitation Qin Sai Tong. Bai Road West when the bird can Hengjue Emei summit. </ The p- > 
    < the p- style = "background-Color: Chocolate" > the p-Seoul to forty-eight thousand thousand years, with no signs of human habitation Qin Sai Tong. Bai Road West when the bird can Hengjue Emei summit. </ P > 
    < P style = "background-Color: Chartreuse" > p Seoul to forty-eight thousand thousand years, not with the Qin Sai Tong populated. Bai Road West when the bird can Hengjue Emei summit.</ The p- > 
    < the p- style = "background-Color: Green; width: 300px;" > the p-width = 300px Seoul to forty-eight thousand thousand years, not with the Qin Sai Tong populated. Bai Road West when the bird can Hengjue Emei summit. </ The p- > 
    < the p- style = "background-Color: Red; width: 500px;" > the p-width = 500px Seoul to forty-eight thousand thousand years, not with the Qin Sai Tong populated. Bai Road West when the bird can Hengjue Emei summit. </ P > 
    block element of h (h1 of, H2, H3): < br > 
    < h1 of style = "background-Color: Red" > h1 of Shudaonan </ h1 of > 
    < H2 style = "background-Color: Green" >H2 > 
    < H3 style = "background-Color: Blue" > H3 Shudaonan </ H3 > 
    < H3 style = "background-Color: Pink; width: 300px by;" > H3 width = 300px by Shudaonan </ H3 > 
    < H3 style = "background-Color: Yellow; width: 500px;" > H3 width = 500px Shudaonan </ H3 > 
    span of inline elements: < br > 
    < span style = "background-Color: Red" > West when the bird Bai Road, can Hengjue Emei summit. <
    style = "background-Color: Green" > West when there Taibai Bird Road, you can Hengjue Emei summit. </ Span > 
    < span style = "background-Color: Blue" > When the West Road Bai bird can Hengjue Emei summit. </ Span > 
    < br > inline elements of A: < br > 
    < A the href = "#" style = "background-Color: Yellow" > to collapse to destroy dead warrior, then with stack stone ladder hook. </ A > 
    < A the href = "#" style = "background-Color: Blue" > To destroy the warrior landslide death, then stack stone ladder with hook. </ A >
    < A href = "#" style = "background-Color: Red" > to destroy the warrior landslide death, then stack stone ladder with hook. </ A > 
    < A href = "#" style = "background-Color: Green" > to destroy the warrior landslide death, then stack stone ladder with hook. </ A >

Effect display (default at Google browser):

  From the above results figures, it can be seen, some of the block elements and inline elements will own default style, for example: p, h1, h2, h3

p comes with default style is:

p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

 

 

 h1 comes with default styles:

h1 {
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

 

 

 h2 comes with default styles:

h2 {
    display: block;
    font-size: 1.5em;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

 

 h3 comes with default styles:

h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

 

 Of course there will be the body element with the default style:

body {
    display: block;
    margin: 8px;
}