Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Create A Responsive Online Education Website Design Tutorial Using HTML / CSS / SASS / JavaScript
Play lesson

Complete Responsive Website Designs - Create A Responsive Online Education Website Design Tutorial Using HTML / CSS / SASS / JavaScript

4.0 (0)
7 learners

What you'll learn

This course includes

  • 218 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

how to make a complete responsive online education / classes / study multipage website design template using html css / sass and vanilla javscript step by step. create a complete responsive multi-pages online education website design using html css / sass and vanilla javascript from scratch. the main feature of this website are: ✅ responsive sticky header with drop down menu and toggle navbar effects. ✅ responsive home section using css flexbox. ✅ responsive category section using css grid. ✅ responsive about section using css flexbox. ✅ responsive courses section using css grid. ✅ responsive teachers section using css grid. ✅ responsive blogs / news / post section using css grid. ✅ responsive contact section using css flexbox and grid. ✅ responsive footer section using css flexbox. * SOURCE CODES * DOWNLOAD THE SOURCE CODE FROM GOOGLE DRIVE ( INCLUDES IMAGES ): https://drive.google.com/file/d/1kjC1KGNYhqrnqZ3ACnGjUBPhzfgl9HnW/view?usp=sharing *How To Download* Step 1 :- click the google drive link ☝☝☝ Step 2 :- click on download link in the google drive. Step 3 :- extract the zip file into your desired folder. Step 4 :- open the folder and then rename each coding files. Step 5 :- convert each coding files example ( index.txt to index.html ) - ( style.txt to style.css ) - ( script.txt to script.js ). Step 6 :- open the converted index.html file into your browser. Step 7 :- open your editor and put your converted into it and then edit it as you like. font awesome cdn link: https://cdnjs.com/libraries/font-awesome google fonts: https://fonts.google.com/specimen/Nunito?query=poppins clip-path generator: https://bennettfeely.com/clippy/ border-radius genrator: https://9elements.github.io/fancy-border-radius/ Editor : - visual studio code with Laetus: Dark Vibrant Theme Browser : - google chrome UI Tool : - Figma Images / Video / SVG : - 01 - https://www.freepik.com/ 02 - https://storyset.com/ 03 - https://undraw.co/ 04 - https://pixabay.com/ 05 - https://unsplash.com/ 06 - https://pixabay.com/ New To My Channel Subscribe Now And See More Stuff Like This: https://youtube.com/channel/UCKwgH3vASrD2brd1l2m6NHw Timestamp: 0:00 demo 5:53 file structure 7:38 header section 27:39 footer section 39:23 home section 43:59 category section 47:33 heading section 50:29 about section 54:33 couse-1 section 1:00:44 course-2 section 1:09:27 course-3 section 1:27:05 teachers section 1:37:12 blogs section 1:44:15 contact section 1:56:00 final demo #FrontEnd #OnlineClasses #CompleteWebsite

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere