Join Create aPortfolio site with HTML, CSS & Bootstrap to learn the Most Popular Responsive Framework quickly and easily.
Why ?
Bootstrap 3 is a lightweight and responsive framework for a better and faster mobile-friendly web development.
Bootstrap 3 is easy to learn
Bootstrap 3 saves you time and help speed up your web developmentprocess
In this Bootstrap video tutorial you'll learn :
Effectively use the grid system to build a responsive and flexible multi-column layout
Showcase your artwork/portfolio items with a simple image hover effect
Use the FLAT UI colors palette
Use the inspector tool to customize the Boostrap CSS built-in classes
In less than 2 hours,you will learn about responsive design & fast web development and create a beautiful and responsive online portfolio to showcase your products with this project-based tutorial.
Lessons include topics like:
How to use the 12-column Grid System
Adding and customizing links and buttons
Using Font Awesome to easily include scalable social media icons
Using the pseudo-class :hover to create cool hover effects
PLUS, you will discover other resources like:
The Font Awesome icons designed by Bootstrap
The Google Fonts
The online favicon generator
W3C validation service to build an error-free webpage
By the end of the course, you will have a better understanding of the responsive grid and the bootstrap documentation.
By the end of the course, you will have a nice responsive one-page site that you can use as a personal page or a professional portfolio.
By the end of the course, you will be well-versed with most of the Bootstrap built-in CSS and components.
You will be ready to design sleek, mobile-ready websites with HTML and CSS
The video lessons will walk you through each process step-by-step. Join me to create your portfolio & learn about the most popular open-source responsive framework Bootstrap 3.
What will you learn in this course?
Course plan
Chapter 1
Welcome!
Welcome!
Chapter 2
Header
Header
Chapter 3
Portfolio & Works Section
Portfolio & Works Section
Chapter 4
Contact Us & Footer
Contact Us & Footer
Chapter 5
Responsive Template & Media Queries
Responsive Template & Media Queries
Chapter 6
BONUS Video Lessons
BONUS Video Lessons
Detailed course plan
Chapter 1 : Welcome!
53
Lesson 1Introduction
Chapter 2 : Header
20m21
Lesson 1Navigation Bar
Lesson 2Header & Banner
Chapter 3 : Portfolio & Works Section
18m31
Lesson 1Layout & Grid System
Lesson 2Adding Content & Images | Placeholdit.it
Lesson 3CSS Transition | Image Hover Effect
Chapter 4 : Contact Us & Footer
29m03
Lesson 1Responsive Contact Form
Lesson 2Social Media Icons | Font Awesome
Lesson 3Footer | HTML Entities
Chapter 5 : Responsive Template & Media Queries
17m29
Lesson 1Responsive Friendly | Ipad
Lesson 2Responsive Friendly | Iphone
Chapter 6 : BONUS Video Lessons
15m07
Lesson 1Google Font
Lesson 2Adding a Favicon
Lesson 3W3C Validator
Lesson 4Scrollspy.js
Previews
Your questions about the course
With which software versions is this tutorial compliant ?
Bootstrap 3, HTML
What is the required level to follow this tutorial ?