Block-level elements and row-level elements (inline elements)

Source: Internet
Author: User

inline elements (inline Element) are generally based on semantic level (semantic) basic elements. Inline elements can only hold text or other inline elements, common inline element "a".

Both the block element and the inline element are concepts in the HTML specification. The basic difference between a block element and an inline element is that the block element generally starts from the new row. When CSS control is added, this attribute difference between the block element and the inline element does not become a difference. For example, we can completely

The inline element cite plus display:block such a property, so that he also has the property of starting from the new line each time.

block-level tags: displayed as "block", exclusive line

No matter how much content will occupy a whole line

With width and height, you can set the width height through the width, height property

row-level Labels: display in a single line in chronological order

Occupy only the width of the display's own content, not the entire row

Width height cannot be set by width, Height property

If you set the Float property or the display property, you can set the width height

Inline-block: does not occupy the entire line, but can be set wide by width, height

For example: Pictures, buttons, single check boxes, single-line/multiline text boxes, etc.

The display property can be converted to each other: Display:block/inline/inline-block

Block element

      • Address-Addresses
      • BLOCKQUOTE-Block Reference
      • Center-lifting Alignment block
      • DIR-List of directories
      • Div-Common block-level easy, is also the main tag of CSS layout
      • DL-Definition List
      • Fieldset-form control Group
      • Form-Interactive Form
      • H1-Big title
      • H2-Subtitle
      • H3-3 level headings
      • H4-4 level headings
      • H5-5 level headings
      • H6-6 level headings
      • HR-Horizontal Divider Line
      • Isindex-input prompt
      • menu-List of menus
      • Noframes-frames Optional content (Display this chunk content for browsers that do not support frame)
      • NoScript-Optional script content (this content is displayed for browsers that do not support script)
      • OL-Sorted list
      • P-Paragraph
      • Pre-formatted text
      • Table-Tables
      • UL-Non-sorted list

Inline elements (inline element)

      • A-anchor point
      • ABBR-Abbreviation
      • Acronym-the first word
      • B-Bold (not recommended)
      • Bdo-bidi Override
      • Big-Large font
      • BR-line break
      • Cite-citation
      • Code-Computer codes (required when referencing source)
      • DFN-Defining fields
      • EM-emphasize
      • Font-typeface settings (not recommended)
      • I-Italic
      • IMG-Images
      • Input-Enter box
      • KBD-Define keyboard text
      • Label-Table Label
      • Q-Short Reference
      • S-Medium dash (not recommended)
      • Samp-Define sample computer code
      • Select-Project Selection
      • Small-Small font text
      • Span-a common inline container that defines chunks within a text
      • Strike-Medium Dash
      • Strong-Bold Emphasis
      • Sub-subscript
      • SUP-Superscript
      • TEXTAREA-Multi-line text input box
      • TT-Telex text
      • U-Underline
      • var-Defining variables

Variable element

A mutable element is a block element or an inline element that determines whether the element is in context.

      • Applet-java Applet
      • Button-Buttons
      • Del-delete text
      • Iframe-inline Frame
      • INS-Inserted text
      • Map-image block (map)
      • Object-object Object
      • Script-client-side scripting

Block-level elements and row-level elements (inline elements)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.