CSS block-level elements and inline elements

According to the CSS specification, each page element has a display property that determines the type of the element, and each element has a default display property value, such as a DIV element, whose default display property value is "block", which becomes a "chunk-level" element ( Block-level), and the default display property value for the span element is "inline", which is called the inline element. Div such a block-level element, will automatically occupy a certain rectangular space, you can set the height, width, internal and external margins and other properties to adjust the appearance of the rectangle, in contrast, like "span" "a" such as the line element, there is no independent space, it is attached to other block-level elements exist, therefore, Setting the height, width, inner and outer margins of the inline element is not valid. The width and height will not work if the following code removes the Display:block property value.

<spanstyle= "Width:100px;height:100px;display:block;background-color:blue;"></span>

 

In XHTML, each object has its own default display mode. The default display mode for div objects is display:block. This makes the DIV a block container whose default space is to occupy the entire line of space. The default display mode for a span object is display:inline. The display property is used to change the displayed mode of the element.

Margin controls the spacing between inline and block-level elements, not just inline elements. It is important to note the conversion issues between them, such as block-level elements plus the float property becoming inline elements.

A mutable element is a block element or an inline element that determines whether the element is in context. * Applet-java applet* button-button * del-delete text * iframe-inline frame* ins-Inserted text * Map-image chunk (map) * Object-object Object * s Cript-Client Script

CSS block-level elements and inline elements