Make Responsive Website Using HTML & CSS | Fully functional Multi Page Website Design Step by Step
Let's make a complete business website using HTML and CSS only that can send an email and is fully responsive on any device. Step by step process to create a fully functional and totally responsive website using HTML and CSS. Source code: https://github.com/aashishpanthi/hostque Part 2: coming soon ... In this video, we'll be creating a complete multipage website that has all the basic functionality needed for a startup or an organization. It will be a fully responsive website design and we will create 4 different website pages and we will link all pages through the navigation menu. We will learn to create Home Page, Pricing Page, Contact page, and Login page with a working contact form. And at last, we'll host it for free with a custom domain like this one: https://hostque.netlify.app/ Main things about this video: 1. You will learn to structure the project 2. You can send email without any backend 3. You will learn to reuse the same CSS styles 4. You will get a good understanding of the flexbox 5. You can make a complete responsive website 6. Learn glassmorphism form design 7. Hosting using Netlify.com Download the images used in this website from the links below and try to code along with me. That way you will get the most out of this tutorial. space.jpg :: https://unsplash.com/photos/Q1p7bh3SHj8 laptop.jpg :: https://unsplash.com/photos/Im7lZjxeLhg man_with_computer :: https://unsplash.com/photos/PbUShBsiwZI lock.jpg :: https://unsplash.com/photos/lmFJOx7hPc4 favicon :: https://bit.ly/3EAVGz2 SVGs :: https://undraw.co/search OR download all from here: https://git.io/JPiq2 You need not know much, to begin with, in this tutorial, I will be explaining everything in this video. This video may get longer but I think it's worth it. Stick around and I will show you how to create a website. If you are an absolute beginner then I think it's the best video to get started. And forgive me if I sound horrible in English. The real reason is that I'm horrible at English. And here is the time stamp: 00:00:00 - intro 00:00:19 - demo 00:03:34 - making video longer 00:04:10 - Project setup and basics 00:10:55 - Start coding (Links setup) 00:15:21 - Making navbar 00:50:24 - Main text area of the home section 00:59:46 - Making responsive design 01:03:11 - Making navbar responsive 01:23:49 - Coding about section 01:44:05 - Making trusted by (about section) 01:55:48 - Making subscribe box 02:03:22 - Making footer (copyright text area) 02:08:31 - Coding pricing section 02:35:40 - Completed two pages (next two pages) WORTH CHECKING:- Hosting websites for free(playlist): https://www.youtube.com/playlist?list=PL9RVyg6xl__g97QlXHEMukWwI6qbSA4ZG Making Facebook Clone using HTML & CSS: https://youtu.be/-sIS4uRDAnI Send EMAIL without backend (using HTML): https://youtu.be/nV1d1Bz7-MM Top 5 online CODE editors: https://youtu.be/uZcMh6BKtW8 AROUND THE WEB: GitHub: @aashishpanthi https://www.github.com/aashishpanthi Instagram: @aashishpanthi11 https://instagram.com/aashishpanthi11 Dev.to: @aashishpanthi https://dev.to/aashishpanthi Do not click this 🥴: https://bit.ly/352wEsG ------------------------------------------------------------------------------------- Appreciate: Images from Unsplash:: https://unsplash.com Free video from Pixaby:: https://pixabay.com Free video from Pikbest:: https://pikbest.com Free video from Pexels:: https://pexels.com Free stocks from Mixkit:: https://mixkit.co Illustrations from undraw:: https://undraw.co/illustrations Free stuff from Flaticon:: https://www.flaticon.com/ And legendary Giphy:: https://giphy.com/ And all those websites and products that helped me in this video. Hey there lovely people, this channel is about WEB DEVELOPMENT && PROGRAMMING. Here, I upload videos once in every uncertain time 😜. Mainly, videos are related to tutorials and informative videos. ------------------------------------------------------------------------------------- I want to tell you something. People who make 15 -16 hours long videos are legends. Cause while creating this video, it took me 3 times more time than I originally decided to take out for this video. I had to work for this straight for several nights. Making the sample, writing some script, recording, removing noise, editing video, and way more things are involved in this process and I'm still working on part -2. So, please don't skip the video and as always I'll see you guys in the next video. ( This is me uploading the video a second time because my first video was half corrupted) #code
Download
1 formatsVideo Formats
Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.