Foundation - Basic Controls Button



Foundation supports many button styles that can be customized according to your needs. When you require more traditional actions, buttons are appropriate tools.

The following table lists the basic controls used in Foundation.

Sr.No. Button control & Description
1 Basics

Buttons can be created with less markup tags like <a> and <button>.

2 Sizing

Size and shape of the buttons can be changed by using additional classes.

3 Coloring

Buttons can be colored to give them a additional meaning.

4 Hollow Style

You can use .hollow class to give your button a hollow style.

5 Dropdown Arrows

You can use .dropdown class to add dropdown arrow to your button.

6 Accessibility

When your button does not contain readable text, you can add screen reader-only text to tell it's purpose.

7 SASS Reference

You can change the styles of the components by using SASS Reference.