Maria Clara olarclara

## step-1.html
<!DOCTYPE html>
<html>
  <head>
    <!-- os metadados vão aqui-->
  </head>
  <body>
    <!-- o conteúdo vai aqui. -->
  </body>
</html>

## step-2.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>
  </head>
  <body>
    <!-- o conteúdo vai aqui. -->
  </body>
</html>

## html-separate-css.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>

    <link rel="stylesheet" href="caminho/para/seu/arquivo.css">
  </head>
  <body>
    <!-- o conteúdo vai aqui. -->

## html-head-css.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>

    <style>
      body {
        margin: 0;
        font-family: 'Helvetica', sans-serif;

## html-inline-css.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>
  </head>
  <body style="text-align: center;">
    <p style="font-weight: bold;">Esse é um parágrafo.</p>
  </body>
</html>

## fonts.css
body {
  font-family: 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.5em;
  font-weight:  bold;
}

## background.css
div {
  background-color: #00897B;
  background-image: url('caminho/para/sua/imagem.png');
  background-repeat: no-repeat;
  background-size: 100% 100%:
}

## selectors.css
/* tag html */
body {
  background-color: blue;
}

/* acessando via id */
#unique {
  font-size: 24pt;
}

## links.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>
  </head>
  <body>
    <!-- abre página especificada na aba atual -->
    <a href="./algum/link">acese a página.</a>


## images.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML & CSS Codelab para Mulheres</title>
  </head>
  <body>
    <img src="caminho/para/a/imagem" alt="breve descrição da imagem">
  </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<!-- os metadados vão aqui-->
	</head>
	<body>
	<!-- o conteúdo vai aqui. -->
	</body>
	</html>
	body {
	font-family: 'Helvetica Neue', 'Helvetica', sans-serif;
	font-size: 1.5em;
	font-weight: bold;
	}
	div {
	background-color: #00897B;
	background-image: url('caminho/para/sua/imagem.png');
	background-repeat: no-repeat;
	background-size: 100% 100%:
	}
	/* tag html */
	body {
	background-color: blue;
	}

	/* acessando via id */
	#unique {
	font-size: 24pt;
	}