mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-05-21 13:24:08 +03:00
rearrange docs components
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
<a id="buttons"></a>
|
||||
|
||||
# Buttons
|
||||
---
|
||||
layout: page
|
||||
title: Buttons
|
||||
---
|
||||
|
||||
Use any of the available button classes to quickly create a styled button.
|
||||
|
||||
@@ -24,10 +25,6 @@ Use any of the available button classes to quickly create a styled button.
|
||||
<button type="button" class="btn btn-link">Link</button>
|
||||
{% endexample %}
|
||||
|
||||
|
||||
|
||||
<a id="buttons-sizes"></a>
|
||||
|
||||
## Sizes
|
||||
|
||||
Fancy larger or smaller buttons? Add `.btn-lg`, `.btn-sm`, or `.btn-xs` for additional sizes.
|
||||
@@ -54,10 +51,6 @@ Create block level buttons—those that span the full width of a parent—by add
|
||||
<button type="button" class="btn btn-secondary btn-lg btn-block">Block level button</button>
|
||||
{% endexample %}
|
||||
|
||||
|
||||
|
||||
<a id="buttons-active"></a>
|
||||
|
||||
## Active state
|
||||
|
||||
Buttons will appear pressed (with a darker background, darker border, and inset shadow) when active. **There's no need to add a class to `<button>`s as they use a pseudo-class**. However, you can still force the same active appearance with `.active` should you need to replicate the state programmatically.
|
||||
@@ -67,10 +60,6 @@ Buttons will appear pressed (with a darker background, darker border, and inset
|
||||
<a href="#" class="btn btn-secondary btn-lg active" role="button">Link</a>
|
||||
{% endexample %}
|
||||
|
||||
|
||||
|
||||
<a id="buttons-disabled"></a>
|
||||
|
||||
## Disabled state
|
||||
|
||||
Make buttons look unclickable by adding the `disabled` boolean attribute to any `<button>` element.
|
||||
@@ -102,10 +91,6 @@ As `<a>` elements don't support the `disabled` attribute, you must add the `.dis
|
||||
<p>While button classes can be used on <code><a></code> and <code><button></code> elements, only <code><button></code> elements are supported within our nav and navbar components.</p>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<a id="buttons-tags"></a>
|
||||
|
||||
## Button tags
|
||||
|
||||
Use the button classes on an `<a>`, `<button>`, or `<input>` element.
|
||||
@@ -117,7 +102,6 @@ Use the button classes on an `<a>`, `<button>`, or `<input>` element.
|
||||
<input class="btn btn-secondary" type="submit" value="Submit">
|
||||
{% endexample %}
|
||||
|
||||
|
||||
<div class="bs-callout bs-callout-warning">
|
||||
<h4>Cross-browser rendering</h4>
|
||||
<p>As a best practice, <strong>we highly recommend using the <code><button></code> element whenever possible</strong> to ensure matching cross-browser rendering.</p>
|
||||
|
||||
Reference in New Issue
Block a user