Html-block-level elements and inline elements

Html-block-level elements and inline elements

Block-level elements

Inline elements

address- Block-block reference Center-center to aligning (not recommended) Dir-directory list (HTML5 kicked Out) Div-often You can't use it anymore. dl-list fieldset-a box containing a form group Form-table a single   H1 ~ h6 various size headings Hr-horizontal divider (not recommended) Menus-menu list Noframes-browser does not support frames displayed blocks noscript-  Browser does not support script-displayed blocks Ol-sequence table ul- Unordered list P-paragraph pre-formatted text Table-table a grid

A-anchor point abbr-abbreviation (semantic, search engine) acronym- First word (HTML5 kick Out) B-bold (not recommended) Big-large font (not recommended) Cite-citation (semantic, search engine) code-reference source (semantics) Em-emphasis ( If you want to use <i> for italic only) Font-font settings (not recommended) I-italic img-picture Input-input box Label-form label (event Association corresponding to table Item) Q-short Reference (standard add quotation mark, ie do not add quotation marks) S-medium Dash (not recommended) Samp-for extracting content Select-project selection Small-small font (not recommended) Strong-bold (not recommended) Sub-subscript Sup-superscript textarea-multiline text input box U-underline Var-define variable

After learning html, you will learn some basic HTML elements (element), such as p, h1~h6, br, div, li, ul, img, etc.
If these elements are broken down, they can be grouped separately intoTop(top-level) element,Block-level(block-level) Elements andInline(inline) Element.

1.Top-level element"top-level Element": {html, body, Frameset}
including html, body, frameset, performance such as Block-level element, belonging to the advanced Block-level Elements.

2.Block-level element"block-level Element": {p, h1~h6, div, ul}
As the name implies is a block display elements, height width can be set. For example, we commonly used p, h1~h6, div, ul default state is a block-level element. Block-level elements are more overbearing, the default state occupies an entire line each time, the following content must be a new line to Display. of course, non-block-level elements can also be display:block through css, changing them to Block-level Elements. In addition, there is a special, float also has this function.
Block-level elements can exist independently, separating the general block-level elements with a newline (such as a line after a paragraph ends). Block-level elements are the primary and key elements that make up an html, and any block-level element can be interpreted with the box model.

3.Inline elementInline Element: {a, br, em, img, li, span}
Popular point is the way text is displayed, in contrast to Block-level elements, the height of the inline element is not set to the width of its own text or the width of the Picture. The <a>, <span>, <em>, which we commonly use, belong to inline elements. Inline elements are displayed as Text-like displays and do not occupy a single line alone. of course, inline elements can also become block-level elements, that is, through the display:inline of css, and float to Achieve.

As defined in the CSS authoritative guide, " any visible element that is not a block-level element is an inline element." the characteristic of its performance is the "row layout" form. "i'm personally not used to the line layout, because I think block-level elements behave more like" rows ", while inline elements are more like" text "display properties. It is important to remember that the height width of an inline element is not set, and its width is the width of its own text or Image. Since you set the width of the height of half a day after no response to discover, originally this is only an inline element.

Html-block-level elements and inline elements