Animated Hero Image | Audio website from scratch using HTML CSS Python and Java Script смотреть онлайн

Building a website from scratch using HTML and CSS.
So far the NavBar is in place, a hero section has been allowed for and a contents section below the fold is ready. In this video, animation is added to an object contained within the hero section. I'm animating colour, position and rotation. This is a good learn opportunity as i haven't us animation before.

The sites I build use HTML styled with CSS, Python to template and JavaScript for functionally where required. I make my websites from scratch using Visual Studio Code software.
My sites are mobile responsive exploiting Flexbox in the CSS. JavaScript used only when required.

This video is part of a series. Checkout my other videos:
https://youtube.com/playlist?list=PLZzIfx3OIzSuVk4tBBpegXJ2r8dd6nIE_

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
0:00 - Introduction
0:30 - Colour gradient background
1:15 - Object on hero section
1:26 - Adding key frames
1:48 - Box shadow inset
2:15 - Automate movement and colour
3:05 - Populating the key frames
4:02 - Adding foreground text
4:20 - Checking mobile responsive
4:45 - Simple text area layout
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

Border Radius on YouTube: https://youtu.be/j3Z4DR0o8bk
9elements site: https://9elements.github.io/fancy-border-radius/

I independently work on Framework2232 in my free time. If you like show your support, please follow and promote the usual social media.

FOLLOW FRAMEWORK2232:
Website: https://www.framework2232.github.io
Twitter: https://twitter.com/framework2232
Instagram: https://www.instagram.com/framework2232
Pinterest: https://www.pinterest.com.au/framework2232

For HTML Headtags: https://www.htmlheadtags.com

Background Music:
When I use background music in my YouTube uploads, I slap the music together myself using LMMS and retain original files. It may not be a top 10 hit but as I made it myself, can't be hit with copyright claim.

#HTML #CSS #animation