Styling a responsive navigation bar – Internet design tutorial



Webflow’s navbar ingredient could be very versatile in terms of styling. On this video, we’ll concentrate on 5 areas that give us that management:

1. Measurement of the navbar
2. Positioning of the navbar
3. Nav hyperlink states
4. Navbar and nav hyperlink backgrounds
5. Nav hyperlink transitions

Steps within the video:
00:00 – Introduction
00:14 – Measurement
01:46 – Positioning
02:11 – Typography
02:39 – Background
03:21 – Transitions

———-

Get began with Webflow:
https://assist.webflow.com/programs/getting-started

http://webflow.com

http://fb.com/webflow

source

19 thoughts on “Styling a responsive navigation bar – Internet design tutorial”

  1. I dont have a menu button i only have, Show or Hide Menu now, and it doesnt seem to be the same thing since when I preview the menu, the text style is different…
    this old webflow looks so much simpler.. it took me so long to find states now because of the webflow updates and for some reason states has now been hidden in the class dropdown?! that makes no sense. atleast here it says STATES

    Reply
  2. Awesome, but how can you correctly implement a navbar across multiple pages?
    Something like a navbar component that you would edit once and updates in all the other pages…

    Reply
  3. ok but what if i want my logo at the center at the top and the nav bar underneath? why all the webflow tutorials present the same nav bar option? I am quite beginner in webflow but it seems so far not very customisable to me…

    Reply

Leave a Comment