Given that the purpose of the HTML elementary tutorial is only to teach the skeleton elements of HTML, this intermediate tutorial adds some flesh and blood. They should not be extraordinary, but can further enhance our understanding of HTML and enable us to do more useful things.
HTML is just a means to give content, and most HTML tags have their meaning (tag p creates paragraphs, h1 tag creates titles, etc.), however the span and div tags seem to have no content meaning, and sound as useless as a hammer made of a bubble. But in fact, they are used very widely when combined with CSS.
They are used to combine a large chunk of HTML code and give certain information. Most of them are used to associate the class attribute class and identification attribute id with elements. See the class and id selectors in the Intermediate CSS Guide.
The difference between span and div is that span is inlined and used in a small piece of inline HTML, while div (think what division means) elements are block-level (simply put, it is equivalent to having broken lines before and after it), used to combine a large chunk of code.
Sample code [www.CuoXIn.com]