[html] When to use <span> instead <p>?

As the question indicates, if I have some text that I want to add in the HTML then when should I use <p> and when should I use <span>?

<span> is an inline tag, a <p> is a block tag, used for paragraphs. Browsers will render a blank line below a paragraph, whereas <span>s will render on the same line.

Span is completely non-semantic. It has no meaning, and serves merely as an element for cosmetic effects.

Paragraphs have semantic meaning - they tell a machine (like a browser or a screen reader) that the content they encapsulate is a block of text, and has the same meaning as a paragraph of text in a book.

The p tag denotes a paragraph element. It has margins/padding applied to it. A span is an unstyled inline tag. An important difference is that p is a block element when span is inline, meaning that <p>Hi</p><p>There</p> would appear on different lines when <span>Hi</span><span>There</span> winds up side by side.

p {
    float: left;
    margin: 0;
}

No spacing will be around, it looks similar to span.

Semantically speaking, a p is a paragraph tag and should be used to format a paragraph of text. A span is an inline formatting change that isn't handled semantically.

A span is an inline formatting element that does NOT have a line feed above or below.

A p is a block element that HAS an implied line feed above and below.

http://w3schools.com/tags/default.asp

tag is a block-level element but tag is inline element.Normally we use span tag to style inside block elements.but you don't need to use span tag to inline style.you have to do is; convert block element to inline element using "display: inline"

A practical explanation: By default, <p> </p> will add line breaks before and after the enclosed text (so it creates a paragraph). <span> does not do this, that is why it is called inline.

The <p> tag is a paragraph, and as such, it is a block element (as is, for instance, h1 and div), whereas span is an inline element (as, for instance, b and a)

Block elements by default create some whitespace above and below themselves, and nothing can be aligned next to them, unless you set a float attribute to them.

Inline elements deal with spans of text inside a paragraph. They typically have no margins, and as such, you cannot, for instance, set a width to it.

When we are using normal text at that time we want <p> tag.when we are using normal text with some effects at that time we want <span> tag

Semantically, you use <p> tags to indicate paragraphs. <span> is used to apply CSS style and/or class(es) to an arbitrary section of text and inline elements.