diff --git a/exercicio1/index.html b/exercicio1/index.html index fc775a9..a6bccc6 100644 --- a/exercicio1/index.html +++ b/exercicio1/index.html @@ -5,6 +5,7 @@ CSS - prática guiada 1 + diff --git a/exercicio1/style.css b/exercicio1/style.css index e69de29..cfb4d41 100644 --- a/exercicio1/style.css +++ b/exercicio1/style.css @@ -0,0 +1,23 @@ +/*tag < classes < id*/ + +#titulo-importante{ + background-color: blue; + color: white +} + +h1, section{ + background-color: green; +} + +.sub-titulo{ + background-color: yellow; +} + +.titulo-secao{ + color: white +} + +.titulo-pouco-importante{ + color: white; + background-color: black; +} diff --git a/exercicio2/style.css b/exercicio2/style.css index a3b7f1e..eb0d93a 100644 --- a/exercicio2/style.css +++ b/exercicio2/style.css @@ -1,22 +1,34 @@ .longe-bordas{ background-color: #FFA6A9; + margin: 20px 0px 20px 20px; } .afastado{ background-color: #77C0ED; + margin: 50px; + display: block; } + .alto{ background-color: #C3E887; + height: 300px; + } .largo{ background-color: #FFE396; + width: 500px; } .bordado{ background-color: #AF9BCC; + border: solid black 1px; + /* border-style: aparece os estilos de borda + border-radius: deixa os cantos arredondados + margin: 20px; + padding: 20px;*/ } .sumido{ - + display: none; } \ No newline at end of file diff --git a/exercicio3/style.css b/exercicio3/style.css index 10c8270..9d18f78 100644 --- a/exercicio3/style.css +++ b/exercicio3/style.css @@ -9,17 +9,27 @@ header{ section{ 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: 70%; + background-color: blue; + /*padding: 40px;*/ } aside{ float:right; + background-color: yellow; /*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: 30%; } article{ margin: 10px 0; +} + +main{ + font-family: helvetica; +} + +body{ + background-color: blueviolet; } \ No newline at end of file diff --git a/fixacao/style.css b/fixacao/style.css index e69de29..55442e6 100644 --- a/fixacao/style.css +++ b/fixacao/style.css @@ -0,0 +1,39 @@ +/*1*/ +header{ + height: 40px; + padding: 10px; + background-color: orange; + color: white; + border-bottom: solid black 1px; + /*5*/font-family: arial; +} + +footer{ + height: 40px; + padding: 10px; + background-color: black; + color: white; +} +/*3*/ +main{ + margin: 15px; + padding: 20px 30px; + /*padding: 20px 30px 20 px 30px pode ser das duas formas*/ + height: 80vh; + width: 90vw; +} + +/*4*/ +article{ + margin: 25px 0px; +} + +/*5*/ +p{ + font-family: helvetica; +} + +/*6*/ +.destaque{ + color: orange; +} \ No newline at end of file