Personal Profile Page demo link -https://joyshinola-byte.github.io/Frontend-web-development/LAB%202%20PERSONAL%20PROFILE%20PAGE.HTML
ppt link -https://www.canva.com/design/DAHAL9XYoPs/ZK0cfkCMGNLBz2gZrOmIvA/edit?utm_content=DAHAL9XYoPs&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
Personal Profile Page is used to display basic information about an individual. It gives a brief introduction about the person. The page includes personal details such as name, age, date of birth, and contact information.
college notice board demo link - https://joyshinola-byte.github.io/College-notice-board/College%20notice%20board.html
ppt link -https://www.canva.com/design/DAHBc1jLD_w/yyLCtinRs97yBC3nKxUE-w/edit?utm_content=DAHBc1jLD_w&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
Responsible for updating the college notice board regularly. Displays important announcements clearly and neatly. Removes old or outdated notices on time. Ensures students and staff get correct information. Maintains cleanliness and organization of the notice board.
Flexbox DEMO LINK - https://joyshinola-byte.github.io/FLEX-MULTICOLUMN-LAYOUT/multicolum%20layout
PPT LINK - https://www.canva.com/design/DAHBE_0lsJE/0IVKBTewHg-VtBIIlB5Zew/edit?utm_content=DAHBE_0lsJE&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
caption - This layout uses Flexbox to create a responsive multi-column design. Columns automatically adjust based on screen size. The flex-wrap property ensures proper alignment on smaller devices. It provides a clean and flexible structure for modern web pages.
photo gallery DEMO LINK-https://joyshinola-byte.github.io/RESPONSIVE-PHOTO-GALLERY/Resposive%20photo%20gallery.html
PPT link -https://www.canva.com/design/DAHA4wtek84/LODuv8r1KsxjKIu09YynOQ/edit?utm_content=DAHA4wtek84&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
A collection of beautiful moments captured with love This responsive photo gallery showcases a set of memorable photos arranged in a flexible layout. The gallery automatically adjusts according to different screen sizes like mobile, tablet, and desktop, providing a smooth and user-friendly viewing experience.
Registration Form demo link - https://joyshinola-byte.github.io/Frontend-development-2/REGISTRATION%20FORM.HTML
ppt link - https://www.canva.com/design/DAHAO9dW1MQ/mSbjbDOQC1XIlSNZD78Ogg/edit?utm_content=DAHAO9dW1MQ&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
Registration Form is used to collect basic details from users who want to create an account on a website. In this form, users enter their personal and contact information. The collected data helps the organization to identify and communicate with users easily.
Simple webpage with login
demo link-https://joyshinola-byte.github.io/Frontend-web-development/
ppt link-https://www.canva.com/design/DAHCJWmBQCI/hpKIbxKSQvHjNjZiCkDhqg/edit?utm_content=DAHCJWmBQCI&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
This project contains a Login Page and a Landing Page created using HTML, CSS, and JavaScript. When the user clicks the login button, a “Login Successful” alert message is displayed. After the alert the user is redirected to the landing page successfully.
Navigation bar
demo link-https://joyshinola-byte.github.io/Frontend-web-development/navigation%20bar.html
ppt link-https://www.canva.com/design/DAHClo5FuPY/fV8NSJbn9c3LwPs08_HdjA/edit?utm_content=DAHClo5FuPY&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
A navigation bar is a menu placed at the top of a website that helps users move between different pages. It improves user experience by providing easy and organized access to important sections of the website and also with dropdown also added in the navigation bar
Hover effect and transition
demo link -https://joyshinola-byte.github.io/Frontend-web-development/Lab%208%20Hover%20and%20transition%20html
ppt link-https://www.canva.com/design/DAHEQy06QqI/hp0L2h8yedLBk_8QU-U6xw/edit?utm_content=DAHEQy06QqI&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
Hover effect makes elements react when you move the mouse Transitions make those changes smooth and visually pleasing