rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-03-15 15:29:22 +01:00
Code Issues Actions Packages Releases Activity

remove some callouts on buttons by rewriting things a bit

Browse Source
This commit is contained in:
Mark Otto 2015-04-29 11:44:19 -07:00
parent 52133e41c5
commit a999a0aff2
1 changed files with 3 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/components/buttons.md
View File

@ -37,7 +37,9 @@ Using color to add meaning to a button only provides a visual indication, which
## Button tags ## Button tags
Use the button classes on an `<a>`, `<button>`, or `<input>` element. As a best practice, **we highly recommend using the `<button>` element whenever possible** to ensure matching cross-browser rendering. However, you may also use button classes on `<a>`, `<button>`, or `<input>` elements.
When using button classes on `<a>` elements, be sure to include the `role="button"` for improved accessibility.
{% example html %} {% example html %}
<a class="btn btn-secondary" href="#" role="button">Link</a> <a class="btn btn-secondary" href="#" role="button">Link</a>
@ -46,18 +48,6 @@ Use the button classes on an `<a>`, `<button>`, or `<input>` element.
<input class="btn btn-secondary" type="submit" value="Submit"> <input class="btn btn-secondary" type="submit" value="Submit">
{% endexample %} {% endexample %}
{% callout warning %}
#### Links acting as buttons
If the `<a>` elements are used to act as buttons – triggering in-page functionality, rather than navigating to another document or section within the current page – they should also be given an appropriate `role="button"`.
{% endcallout %}
{% callout warning %}
#### Cross-browser rendering
As a best practice, **we highly recommend using the `<button>` element whenever possible** to ensure matching cross-browser rendering.
{% endcallout %}
## Sizes ## Sizes
Fancy larger or smaller buttons? Add `.btn-lg`, `.btn-sm`, or `.btn-xs` for additional sizes. Fancy larger or smaller buttons? Add `.btn-lg`, `.btn-sm`, or `.btn-xs` for additional sizes.