labenuexercicios · EmersonCostaDevWeb · Sep 6, 2022
diff --git a/exercicio1/index.html b/exercicio1/index.html
@@ -5,6 +5,7 @@
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>CSS - prática guiada 1</title>
+   <link rel="stylesheet" href="./style.css">
 </head>
 
 <body>

diff --git a/exercicio1/style.css b/exercicio1/style.css
@@ -0,0 +1,26 @@
+h1{
+    background-color: blue;
+    color:#fff;
+}
+
+/* id é mais forte que a tag em questao */
+
+#titulo-importante{
+    background-color: blueviolet;
+}
+
+h2{
+    background-color: yellow;
+}
+section{
+    background-color: green;
+}
+
+.titulo-secao{
+    color:#fff;
+}
+
+footer{
+    background-color: black;
+    color:#fff;
+}
diff --git a/exercicio2/style.css b/exercicio2/style.css
@@ -1,22 +1,27 @@
 .longe-bordas{
     background-color: #FFA6A9;
+    padding: 10px;
   }
 
   .afastado{
     background-color: #77C0ED;
+    margin-left:50px;
   }
   .alto{
     background-color: #C3E887;
+    height:300px;
   }
 
   .largo{
   background-color: #FFE396;
+  width:500px;
   }
 
   .bordado{
     background-color: #AF9BCC;
+    border: 10px solid blueviolet;
   }
 
   .sumido{
-
+    display: none;
   }
diff --git a/exercicio3/style.css b/exercicio3/style.css
@@ -1,25 +1,48 @@
-*{
+/*{
   padding: 0;
   margin: 0;
-}
+
+}*/
 header{
-
+  height: 40px;
+  padding: 10px;
+  border-bottom: black;
+  font-family: Helvetica;  
+}
+main {
+  font-family:Helvetica;
+  background-color: aqua;
+  margin: 15px;
+  padding: 20px 30px;
+  width: 90vw;
+  height: 80vh;   
 }
 
 section{
+  /* vw - 1% da telada */
+  /* vh 1% do tamnho da tela  */
+  /* %  relativo ao elemeto pai */
   float: left;
 /*float é uma propriedade que permite deixar elementos à direita ou à esquerda da tela. Não costuma ser usado. Aqui, é usado apenas para ilustrar diferenças.*/
-  width: 840px;
-  padding: 40px;
+  width: 50vw;
+  /* padding: 40px; */
+  background-color: violet;
 }
 
 aside{
-  float:right;
+  /*float:right*/
  /*float é uma propriedade que permite deixar elementos à direita ou à esquerda da tela. Não costuma ser usado. Aqui, é usado apenas para ilustrar diferenças.*/
-  padding: 20px;
-  width: 340px;
+  /* padding: 20px; */
+  width: 84vw;
+  background-color: yellowgreen;
 }
 
 article{
-  margin: 10px 0;
+  margin: 25px 0;
+}
+
+footer{
+  height: 40px;
+  padding: 10px;
+  background-color: black;
 }
diff --git a/fixacao/index.html b/fixacao/index.html
@@ -27,7 +27,7 @@ <h2>Bacurau (2019) — Globoplay</h2>
         <article>
             <h2>Como Nossos Pais (2017) — Netflix</h2>
             <p>Rosa é uma mulher que <span class="destaque">tenta conciliar seus desejos, sonhos e objetivos
-                 profissionais com a maternidade e um casamento em crise</span>; além disso, ela ainda tem que lidar
+                    profissionais com a maternidade e um casamento em crise</span>; além disso, ela ainda tem que lidar
                 com a relação complicada com sua mãe. Essa é a premissa de "Como Nossos Pais", filme de Laís Bodanzky
                 que visa discutir a desigualdade de gênero e como a culpa recai sobre as mulheres quando elas não
                 desempenham os papéis que são esperados delas.
@@ -39,7 +39,8 @@ <h2>Que Horas Ela Volta? (2015) — Netflix e Globoplay</h2>
             <p>O filme da cineasta Anna Muylaert conta a história da pernambucana Val, que se muda para São Paulo
                 visando dar melhores condições de vida para a filha, Jéssica. Contudo, quando Jéssica encontra Val em
                 São Paulo anos depois, seu comportamento com a mãe muda drasticamente. Protagonizado por Regina Casé,
-                "Que Horas Ela Volta" é mais um filme brasileiro super elogiado pela crítica, com uma <span class="destaque">história considerada muito tocante.</span></p>
+                "Que Horas Ela Volta" é mais um filme brasileiro super elogiado pela crítica, com uma <span
+                    class="destaque">história considerada muito tocante.</span></p>
         </article>
         <article>
             <h2>Hoje Eu Quero Voltar Sozinho (2014) — Netflix

diff --git a/fixacao/style.css b/fixacao/style.css
@@ -0,0 +1,39 @@
+header {
+    height: 40px;
+    padding: 10px;
+    background-color: orange;
+    color: whitesmoke;
+    border-bottom: black;
+    font-family: Arial;
+}
+
+main {
+    font-family: Helvetica;
+    margin: 15px;
+    padding: 20px 30px;
+    width: 90vw;
+    height: 80vh;
+}
+
+section {
+    width: 50vw;
+    background-color: violet;
+}
+
+article {
+    margin: 25px 0;
+}
+
+.destaque {
+    color: orange
+}
+
+footer {
+    height: 40px;
+    padding: 25px;
+    background-color: black;
+    color: #fff;
+}
+p{
+    font-family: Helvetica;
+}