1. No HTML temos dois elementos genéricos para ajudar na organização da página, o <div> e o <span>. Eles são similares e a principal diferença é que o <div> organiza em blocos e o <span> organiza em linha.
  2. Crie um novo arquivo chamado “organizacao.html”. Utilize o elemento <div> para agrupar um conteúdo:
<html>
<head>
	<title>Organização com div e span</title>
</head>

<body>
	<h1>Organização de código com div e span</h1>

	<p>
		Em um texto, o elemento div irá organizar o conteúdo em
		<div>um bloco, ou seja, como uma quebra de linha.</div>
		Uma div ocupa todo o espaço horizontal disponível na tela.
		Já o elemento span irá organizar o  conteúdo de forma "inline",
		ou seja, sem quebra de linha e ocupando apenas
		a largura do seu conteúdo interno.
	</p>
</body>
</html>
Agora adicione o elemento <span>:
<html>
<head>
	<title>Organização com div e span</title>
</head>

<body>
	<h1>Organização de código com div e span</h1>

	<p>
		Em um texto, o elemento div irá organizar o conteúdo em
		<div>um bloco, ou seja, como uma quebra de linha.</div>
		Uma div ocupa todo o espaço horizontal disponível na tela.
		Já o elemento span irá organizar o conteúdo de forma "inline",
		ou seja, <span>sem quebra de linha</span> e ocupando apenas
		<span>a largura do seu conteúdo interno</span>.
	</p>
</body>
</html>