I have a question about block and inline elements.

Asked 2 years ago, Updated 2 years ago, 82 views

Thank you for your help.
You are learning the difference between block element inline elements in CSS and HTML.

https://60pablog.com/html-block-inline/ #CSS
http://www.htmq.com/htmlkihon/005.shtml

I was referring to the above two sites, but it was said that the block element inline element could be changed by CSS.
If I change from block element to inline element in CSS, width and height cannot be specified, but if I change inline element to block element, will block element also be included in inline element?
For example, if you use span as a block element in the second site, can you put p and ul tags in it?

If anyone understands, please take good care of me.

html css html5

2022-09-30 19:55

1 Answers

If I make an inline element a block element, will the inline element also contain a block element?

No.

HTML4 includes block levels and inline as the main classification of elements (categories).By default, HTML4 Strict classifies most of the elements allowed as child elements of the body element into block levels and others into inline.Some elements do not belong to either category here.

[1]
<!ENTITY%inline"#PCDATA|%fontstyle;|%phrase;|%special;|
%formctrl;">

<!ENTITY%block
     "P | %heading; | %list; | %preformed; | DL | DIV | NOSCRIPT |
      BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS " >

<!ELEMENT BODY O(%block;|SCRIPT)++(INS|DEL)-- document body-->

Also, depending on which category, content models, shapes, and handwriting directions are inherited differently (exclusions on handwriting directions are omitted).

  • Content Model
    A content model is an indication of what elements can be taken as child elements.Block-level elements take inline or block-level elements as child elements.The inline element takes the inline element as a child element.

  • Shaping
    HTML4 has different shaping depending on whether it belongs to the block level or inline category, which simply means that the element has a different
    display format depending on whether it belongs to the block level or inline.

    Under normal shaping, block-level elements start new lines, but inline elements do not start new lines.Each element is decorated with a user agent style sheet according to this shaping rule.This means that elements that belong to the Block Level (HTML) category are block level (CSS) by default.If an element belonging to the block level (HTML) category is an inline level (CSS), it does not affect the content model at all.

content model
A content model is an indication of what elements can be taken as child elements.Block-level elements take inline or block-level elements as child elements.The inline element takes the inline element as a child element.

Shaping
HTML4 has different shaping depending on whether it belongs to the block level or inline category, which simply means that the element has a different
display format depending on whether it belongs to the block level or inline.

Under normal shaping, block-level elements start new lines, but inline elements do not start new lines.Each element is decorated with a user agent style sheet according to this shaping rule.This means that elements that belong to the Block Level (HTML) category are block level (CSS) by default.If an element belonging to the block level (HTML) category is an inline level (CSS), it does not affect the content model at all.

(HTML)(CSS)(HTML)(CSS)

7.5.3 Block-level and inline elements[2]

[2]

Certain HTML elements that may appear in BODY are said to be "block-level" while others are "inline" (also known as "text level"). The distinction is found on special notes:

HTML5 and later block level, inline removed from the category, each element belongs to at least zero more subdivided categories [3].There are also elements that do not belong to a particular category or that belong to a category that is not listed below.Furthermore, there is no longer any mention of shaping the regulations for each category, and only the expected behavior for each element is described using CSS rules [4].

[3][4]

3 3.2.5.2 Kinds of content[3]

[3]

Each element in HTML falls into more categories that group elements with similar characteristics together.The following broadcast categories are used in this specification:

  • Metadata content
  • Flow content
  • Sectioning content
  • Heading content
  • Phrasing content
  • Embedded content
  • Interactive content

Note:


2022-09-30 19:55

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.