Posts

Showing posts from August, 2024
Image
 BOUNCE ANIMATION :- (VIDEO48) SOURCE CODE:- <! DOCTYPE html > < html lang =" en "> < head >     < meta charset =" UTF-8 ">     < meta name =" viewport " content =" width=device-width, initial-scale=1.0 ">     < title >Exercise 8 - Bounce Animation</ title >     < style >         * {             margin: 0 ;             padding: 0 ;         }         . container {             background-color: rgb ( 255 , 255 , 255 );             height: 90 vh ;             width: 90 vw ;             position: relative ;         }         . ball {             background-color: red ;      ...
Post a Comment
Read more
Image
 ULTRAEDIT WEBSITE:-(VIDEO47) SOURCE CODE:- CSS:-   /* .logo {             height: 30px;             width: 40px;             background-color: blue;         } */   . logo img {       width: 164 px ;   }   nav {       display: flex ;       justify-content: space-around ;       align-items: center ;       font-family: ' Segoe UI ', Tahoma , Geneva, Verdana , sans-serif ;   }   . right ul {       display: flex ;       gap: 34 px ;   }   . right ul li {       list-style: none ;       display: flex ;       align-items: center ;       padding: 0 5 px ;       cursor: pointer ;   }   . right ul li span {       padding: 0 5 px ...
Post a Comment
Read more
Image
 #DESIGNING WEBSITE LAYOUT:-(VIDEO37) SOURCE CODE:- <! DOCTYPE html > < html lang =" en "> < head >     < meta charset =" UTF-8 ">     < meta name =" viewport " content =" width=device-width, initial-scale=1.0 ">     < title >Layout</ title >     < style >         * {             margin: 0 ;             padding: 0 ;         }         header {             position: sticky ;             top: 0 ;         }         nav {             background-color: rgb ( 56 , 56 , 255 );             color: white ;             height: 53 px ;         }         main {...
Post a Comment
Read more
Image
 #CARD DESIGNING:- (VIDEO 29) SOURCE CODE:- <! DOCTYPE html > < html lang =" en "> < head >     < meta charset =" UTF-8 ">     < meta name =" viewport " content =" width=device-width, initial-scale=1.0 ">     < title >Exercise 3 - Design this Card</ title >     < style >         body {             font-family: sans-serif ;         }         . img > img {             width: 540 px ;             position: relative ;             left: 20 px ;             top: 20 px ;             border-radius: 25 px ;         }         . card {             background-color: rgb ( 255 , 255 , 255 ); ...
Post a Comment
Read more

🔥FLOTING ACTION BUTTON 💯

Image
💯FLOTING ACTION BUTTON:- 🔥SOURCE CODE:- <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Floating Action Button</title>     <style>         body {             font-family: Arial, sans-serif;             margin: 0;             padding: 0;             height: 100vh;             display: flex;             justify-content: center;             align-items: center;             background-color: #f4f4f4;         }         .fab-container {             position: fi...
Post a Comment
Read more

COUNTDOWN TIMER

Image
 ðŸ•‘ COUNTDOWN TIMER: <SOURCE-CODE:∕> <! DOCTYPE html > < html lang =" en "> < head >     < meta charset =" UTF-8 ">     < meta name =" viewport " content =" width=device-width, initial-scale=1.0 ">     < title >Countdown Timer</ title >     < style >         body {             display: flex ;             justify-content: center ;             align-items: center ;             height: 100 vh ;             margin: 0 ;             background: #e0e5ec;             font-family: Arial , sans-serif ;         }         . container {             background: #ffffff;         ...
Post a Comment
Read more