O mica problema de animatie CSS
Scris: Mie Iul 28, 2021
Noroc, MarPlo!
1. Am vizitat pe twitter un site de animatie, in care website-ul actual se numeste CSS-Challenges,com. In respectivul website, sunt mai multe exemple de HTML si CSS.
2. Unul dintre el se numeste 'combined-rotation':
css-challenges.com/combined-rotation
3. Am imprumutat acest mic exemplu, pentru ca imi place cum se rotesc cele doua forme. In total sunt 16 linii de cod.
4. Dar uite cum am procedat:
a. am creat un fisier in Visual Studio Code.
b. am realizat un coy/paste exemplu combined-rotation
c. am lipit acel cod in respectivul fisier in Visual Code
d. dupa care am dat save as
e. intr-un final, nu mi s-a deschis fisierul din exemplu site. Mi-a luat ceva in timp in Visual Studio Code pentru a ma lamuri ce n-am facut bine
5. In partea dreapta in sidebar, sunt niste instrictiuni sau ma rog, niste exemple de linii cod.
6. Intrebare finala: mai trebuia sa vin eu cu o linie de cod in plus de la mine (cu linii de cod suplimentar), pentru a-mi merge si mie exemplu dorit cu animatia personala? Dar uite codul respectiv:
Multumesc anticipat!
1. Am vizitat pe twitter un site de animatie, in care website-ul actual se numeste CSS-Challenges,com. In respectivul website, sunt mai multe exemple de HTML si CSS.
2. Unul dintre el se numeste 'combined-rotation':
css-challenges.com/combined-rotation
3. Am imprumutat acest mic exemplu, pentru ca imi place cum se rotesc cele doua forme. In total sunt 16 linii de cod.
4. Dar uite cum am procedat:
a. am creat un fisier in Visual Studio Code.
b. am realizat un coy/paste exemplu combined-rotation
c. am lipit acel cod in respectivul fisier in Visual Code
d. dupa care am dat save as
e. intr-un final, nu mi s-a deschis fisierul din exemplu site. Mi-a luat ceva in timp in Visual Studio Code pentru a ma lamuri ce n-am facut bine
5. In partea dreapta in sidebar, sunt niste instrictiuni sau ma rog, niste exemple de linii cod.
6. Intrebare finala: mai trebuia sa vin eu cu o linie de cod in plus de la mine (cu linii de cod suplimentar), pentru a-mi merge si mie exemplu dorit cu animatia personala? Dar uite codul respectiv:
Cod: SelectaĊ£i tot
<html>
<body>
<div class="box"></div>
</body>
</html>Cod: SelectaĊ£i tot
.box {
width:280px;
height:280px;
display:flex;
align-items:center;
justify-content:center;
font-family: "Inconsolata", monospace;
font-size: 28px;
border:1px solid #c39f76;
box-sizing:border-box;
}