Featured

How To Create a Responsive Multiple Pages Website using HTML CSS & JavaScript Step By Step Tutorial



Published
Learn How To Create Responsive Multi-Page Website using HTML CSS & JavaScript Complete Step By Step Tutorial.
Get Hostinger Discount: https://www.hostg.xyz/SH8cs

Source files & Live Demo: egatortutorials.com

Part 2: Coming Soon... SUBSCRIBE!

In this tutorial, you're going to learn how to create a completely responsive multiple pages website using HTML, CSS, and JavaScript. We will be using modern CSS (CSS3), HTML5, and a little bit of JavaScript at the end to give our website some functionalities. This website will be built with responsiveness in mind, meaning our website is going to look good on Mobile Phones, Tablets, Laptops, and Desktops.

A basic understanding of HTML and CSS is required, although everything will be explained! As we code along, you will learn how to create multiple pages for your website and also how to link one page to another. We will be using CSS Flexbox and CSS grid to easily align elements on our website since CSS Flexbox and CSS Grid make building responsive websites very simple. We will also be using CSS Variables, to make our website easy to customize.

CSS units like rem (root element), fr (fractions), percentages, vh (viewport height), and vw (viewport width) will be used a lot in this tutorial in order to easily achieve the responsiveness of our website.

Our Website will have a fully functioning contact form so that we can receive messages in our email, a testimonial section with slide effects using SwiperJS, frequently asked questions toggle, and more!

AR Shakir Designs: https://www.arshakir.com

Subscribe to learn how to make a website using HTML, CSS & JavaScript: https://www.youtube.com/channel/UCL8l_VxCAN0jOpaLaRAm8sQ

Create a Complete Responsive Portfolio Website with HTML, CSS & JavaScript: https://www.youtube.com/watch?v=wX1T5mR_yVc&t=7799s


Timestamps
00:00:00 Intro (Project Overview)
00:13:06 Buying Hosting & Claiming Free Domain
00:16:40 Project Files & Folder Structure
00:18:22 VSCode Extensions
00:23:08 Iconscout CDN
00:27:17 CSS Root Variables
00:30:50 Importing Google Fonts
00:33:20 General CSS Styles
00:40:10 Navbar CSS
00:46:10 Header Section HTML
00:50:00 Header Section CSS
00:57:53 Video Modal HTML & CSS
01:02:50 Products Section HTML & CSS
01:11:00 Why Choose Us Section HTML & CSS
01:22:00 Trusted Clients HTML & CSS
01:24:48 Testimonials Section with SwiperJS (Slide Effect)
01:35:50 Frequently Asks Questions HTML & CSS
01:46:30 Call To Action HTML & CSS
01:51:30 Footer HTML & CSS
Category
Web design
Be the first to comment