|
Answer» To create a button, we can use ion-button component. Ion-button comes with few ATTRIBUTES like fill , size, shape , color. - Fill attribute can have one of these three options - solid, outline or clear. Choose solid when you want to fill the background color, choose outline when you want only a THIN border around the button without background color and choose clear when you don’t want any background color or border. Since the requirement is to have an outline, we shall use fill=”outline” .
- Size attribute specified size of the button. Basically , you specify size when you want the button to be small, large or DEFAULT.
- Shape attribute is used when you want the button to have rounded corners. By default , buttons are RECTANGULAR in shape but you can have rounded corners by adding shape=”round” attribute to the markup.
- Color attribute can be used to apply one of the preset themes available with Ionic. Ionic has nine default colors that can be used to change the color of UI components. Each color is a collection of multiple properties, including a shade and tint, used throughout Ionic. The options for color attribute are primary, secondary, tertiary , success, warning, danger , light , medium and dark.
So, to create a button with rounded corners and outline without any background color, the markup would be as below : <ion-button color=”primary” fill=”outline” shape=”round”> Submit </ion-button>
|