Creating Apple’s Website with Bootstrap 4

Apple’s home page is an example for a lightweight and modern design that looks good on any screen size. In this lesson we will recreate it using our powerful web design tool – Bootstrap Studio.

Watch the step-by-step video below, and learn how to use the Bootstrap framework and write mobile-first CSS to make your website responsive.


Some of the highlights of the video are the way we customize the navbar to make it fixed to the top and all links evenly spaced out. Also, you can watch us use Bootstrap’s rows and columns to construct a responsive product grid.

products-grid-preview.png

You can watch the video on YouTube, where we’ve linked to the images we used and the final bsdesign file. For more videos like this, visit and subscribe to our channel. Happy learning!


Bootstrap Studio

The revolutionary web design tool for creating responsive websites and apps.

Learn more

Facebook Comments

More Stuff

Will Gutenberg Replace Page Builders Like Elementor, Divi or Beave... As we keep rolling towards WordPress 5.0, a lot of people are wondering if we’ll see Gutenberg replace page builders like Elementor, Divi or Beaver...
Designing Wedding Templates with Smart Objects Excerpted from Layers: The Complete Guide to Photoshop's Most Powerful Feature, 2nd Edition Let's face it. The designs you can create with Smart Objec...
Making Twenty Eleven Behave The current default theme Twenty Eleven is generally a good starter theme for many bloggers, but it does have a couple of annoying quirks such as no...
How a Race to the Bottom Hurts Your Business’s Bottom Line I once saw a friend of mine nearly destroy his business before it got out of its first year. It wasn’t because of reckless spending, poor marketing, o...
Spread the love

Posted by News Monkey