Scribd
Upload
3 views3 pages

HTML Code

This document is an HTML file that creates a web page featuring a moving flower animation. The flower rotates continuously while a text message 'Miss u' is displayed at the bottom of the page. The page is styled with CSS to ensure a clean and simple layout with a light background.

Uploaded by

flowerblair3
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
3 views3 pages

HTML Code

This document is an HTML file that creates a web page featuring a moving flower animation. The flower rotates continuously while a text message 'Miss u' is displayed at the bottom of the page. The page is styled with CSS to ensure a clean and simple layout with a light background.

Uploaded by

flowerblair3
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Moving Flower</title>

<style>

body {

margin: 0;

overflow: hidden;

background-color: #f0f0f0;

.container {

position: relative;

width: 100%;

height: 100vh;

.flower {

position: absolute;

top: 50%;

left: 50%;
transform: translate(-50%, -50%);

animation: moveFlower 5s linear infinite;

@keyframes moveFlower {

0% {

transform: translate(-50%, -50%) rotate(0deg);

50% {

transform: translate(-50%, -50%) rotate(180deg);

100% {

transform: translate(-50%, -50%) rotate(360deg);

}
.text {

position: absolute;

top: 80%;

left: 50%;

transform: translateX(-50%);

font-size: 24px;

font-family: Arial, sans-serif;

color: #333;

</style>

</head>

<body>

<div class="container">

<img class="flower" src="https://www.flaticon.com/svg/static/icons/svg/3064/3064595.svg"


alt="Flower">

<div class="text">Miss u</div>

</div>

</body>

</html>

You might also like