Veb-sahifalarni yozishda biz html dasturlash tildan foydalanamaiz. Aytgancha, html

Inline elements

In this article, we'll examine HTML inline-level elements and how they differ from block-level elements.
HTML (Hypertext Markup Language) elements historically were categorized as either "block-level" elements or "inline-level" elements. Since this is a presentational characteristic it is nowadays specified by CSS in the Flow Layout.
Inline elements are those which only occupy the space bounded by the tags defining the element, instead of breaking the flow of the content.
Note: An inline element does not start on a new line and only takes up as much width as necessary.

Inline vs. block-level elements: a demonstration

This is most easily demonstrated with a simple example. First, some simple CSS that we'll be using:
.highlight {
background-color:#ee3;
}
Copy to Clipboard

Inline

Let's look at the following example which demonstrates an inline element:

The following span is an inline element;
its background has been colored to display both the beginning and end of
the inline element's influence.

Copy to Clipboard
In this example, the 

 block-level element contains some text. Within that text is a  element, which is an inline element. Because the  element is inline, the paragraph correctly renders as a single, unbroken text flow, like this:

Block-level

Now let's change that  into a block-level element, such as 
:

The following paragraph is a
block-level element;

its background has been colored to display both the beginning and end of

the block-level element's influence.

Copy to Clipboard
Rendered using the same CSS as before, we get:
See the difference? The 
 element totally changes the layout of the text, splitting it into three segments: the text before the 
, then the 
's text, and finally the text following the 
.

Changing element levels

You can change the visual presentation of an element using the CSS display property. For example, by changing the value of display from "inline" to "block", you can tell the browser to render the inline element in a block box rather than an inline box, and vice versa. However, doing this will not change the category and the content model of the element. For example, even if the display of the span element is changed to "block", it still would not allow to nest a div element inside it.