Skip to content

Latest commit

 

History

History
61 lines (53 loc) · 1.39 KB

010.md

File metadata and controls

61 lines (53 loc) · 1.39 KB
Raw

Target #10 (Cloaked Spirits)

1° método

947 caracteres em 02/05/2024.

<div class="circulo1"></div>
<div class="circulo1 circulo2"></div>
<div class="circulo1 circulo3"></div>
<div class="circulo1 retangulo1"></div>
<div class="circulo1 retangulo1 retangulo2"></div>
<style>
  body {
    background-color: #62306D;
  }
  div {
    z-index: 2;
    position: absolute;
    top: 150px;
    left: 50px;
    width: 60px;
    height: 60px;
    border-radius: 50px;
  }
  .circulo1 {
    border: 20px solid #AA445F;
    background-color: #E38F66;
  }
  .circulo2 {
    transform: translate(100px, -100px);
    border: 20px solid #E38F66;
    background-color: #AA445F;
  }
  .circulo3 {
    transform: translate(200px);
    border: 20px solid #AA445F
  }
  .retangulo1 {
    z-index: 1;
    transform: translateY(250px) translateX(100px) scaleY(5) scaleX(3);
    border-radius: 0px;
    border-color: #F7EC7D;
    background-color: #F7EC7D;
  }
  .retangulo2 {
    transform: translateX(100px) translateY(-50px);
  }
</style>

Notas

Revisar: analisar dificuldade encontrada em herdar alguns valores da propriedade border do seletor .circulo1 para os seletores seguintes.

Link para Target #10 (Cloaked Spirits) em CSSBattle.dev.