These are HTML tags but they are not much use without CSS. This page just allows you to recognise DIVs and SPANs when you see them.
DIVs
A DIV is basically a box across the page. It can hold any other visible elements of a Web page including other DIVs. It allows you to DIVide a Web page up to make it easier to organise or format. It does not need to be visible or even affect the look of the page at all.
There is no real point to using DIVs until you use CSS so for now just make sure you realise that this:
<p>Some text in a paragraph. The paragraph is in a DIV.</p>
<p>This paragraph will be in in the DIV.</p>
<p>This paragraph will be outside the DIV.</p>
and this:
<div>
<p>Some text in a paragraph.</p>
<p>This paragraph is also in the DIV.</p>
</div>
<p>This paragraph is outside the DIV.</p>
are basically the same Web page (they should look almost identical). They may look slightly different because of different browser defaults which you learn about later. You might use DIVs to group images or images and text together.
One typical use is to contain images so that you do not need to use BR tags as you did when you put your first image in a Web page. Try putting DIV tags around the IMG element (remove the BR tags) and see what happens.
SPANs
A span is a container for things as well but this time for just parts of things:
<p>This paragraph has <span>a part which is inside</span> SPAN tags.</p>
SPAN tags allow you to identify parts of other elements (normally text) so that you can format them differently or to identify them for other purposes.
Again, this will be clearer once you start CSS. For now you will not see any differences with or without.
