It includes the Foundation elements to work with the web applications smoothly. The following table lists some of the Foundation components −
| Sr.No. |
Component & Description |
| 1 |
Accordion
Accordions contain vertical tabs which are used on websites to expand and collapse large amount of data.
|
| 2 |
Accordion Menu
It displays the collapsible menu with accordion effects.
|
| 3 |
Badge
Badges are similar to labels, which are used to highlight the information such as important notes and messages.
|
| 4 |
Breadcrumbs
It specifies the current location for a site within navigational hierarchy.
|
| 5 |
Buttons
Foundation supports standard buttons with different styles.
|
| 6 |
Callout
Callout is an element, which can be used to place the content inside.
|
| 7 |
Close Button
It is used to dismiss the alert box.
|
| 8 |
Drilldown Menu
Drilldown menu changes the nested lists into vertical drilldown menu.
|
| 9 |
Dropdown Menu
Dropdown menu is used for displaying links in a list format.
|
| 10 |
Dropdown Pane
Dropdown pane displays the content when you click the button.
|
| 11 |
Flex Video
It is used to create video objects in the web pages.
|
| 12 |
Float Classes
It is used to add utility classes to HTML elements.
|
| 13 |
Forms
It is used to create form layout to collect user input.
|
| 14 |
Label
Labels are inline styles, which define a label for an input element.
|
| 15 |
Media Object
It is used to add media objects such as images, video, blog comments etc. Which can be placed left or right of the content block.
|
| 16 |
Menu
It provides access to different modes in the website.
|
| 17 |
Pagination
It is a type of navigation that divides the content into a series of related pages.
|
| 18 |
Slider
It specifies the range of values by dragging a handle.
|
| 19 |
Switch
It is used to switch between on and off state.
|
| 20 |
Table
It represents the data in rows and columns format.
|
| 21 |
Tabs
It is a navigation based tab that displays the content into different panes without leaving the page.
|
| 22 |
Thumbnail
It styles the images in thumbnail shape.
|
| 23 |
Title Bar
It is used to display the current screen used by the user with other menu items.
|
| 24 |
Tooltip
It is small pop-up box that describes the information when you hover the mouse on the link.
|
| 25 |
Top Bar
It is used to create navigation header in the website.
|
| 26 |
Orbit
It is an easy and powerful slider that swipes the elements using the orbit class.
|
