Web Style Guide
Menu
Search

Navbar

A navbar is a collection of links positioned on the top of the page for further content.

Minimum requirements
  • 1 hyperlink (a[href])

Quick access

UsageGuidelines
HTML structurePresetsVariations
Embedding
Nesting
Advanced settings

Presets

?

Variations

?
HTML
Copy to clipboard








	

		

			Interactive viewUsageGuidelinesHTML structurePresetsVariationsEmbeddingNestingTest pageGo to top		

	

	

		
Details

		
Usage
The navbar component is a framework component. Navbars are used to navigate the user through the content.
Guidelines
  1. Should not be added manually to any page
HTML structure
Overall HTML view of a navbar component:
Presets
Navbar presets:
PresetDescription
DefaultDefault template for the ECB website.
Without searchAdditional layout to be used when a complex navigation is present.
BasicAdditional layout to be used when needed.
Variations
Navbar variations:
Embedding
The navbar component cannot be embedded inside other component.
main (HTML file)
        
(component)
            
div.navbar

        

    
Nesting
The navbar component cannot be used as a container of other components and/or elements.
main (HTML file)
        
div.navbar
            
(Element)