@@ -1202,6 +1202,9 @@ For example, <code>section</code> should be wrapped as inline.
...
@@ -1202,6 +1202,9 @@ For example, <code>section</code> should be wrapped as inline.
<divclass="page-header">
<divclass="page-header">
<h1>Buttons</h1>
<h1>Buttons</h1>
</div>
</div>
<h2>Default buttons</h2>
<p>Button styles can be applied to anything with the <code>.btn</code> class applied. However, typically you'll want to apply these to only <code><a></code> and <code><button></code> elements for the best rendering.</p>
<tableclass="table table-bordered table-striped">
<tableclass="table table-bordered table-striped">
<thead>
<thead>
<tr>
<tr>
...
@@ -1249,13 +1252,14 @@ For example, <code>section</code> should be wrapped as inline.
...
@@ -1249,13 +1252,14 @@ For example, <code>section</code> should be wrapped as inline.
</tbody>
</tbody>
</table>
</table>
<h3>Buttons for actions</h3>
<h4>Cross browser compatibility</h4>
<p>As a convention, buttons should only be used for actions while hyperlinks are to be used for objects. For instance, "Download" should be a button while "recent activity" should be a link.</p>
<p>Button styles can be applied to anything with the <code>.btn</code> class applied. However, typically you'll want to apply these to only <code><a></code> and <code><button></code> elements.</p>
<h3>Cross browser compatibility</h3>
<p>IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled <code>button</code> elements, rendering text gray with a nasty text-shadow that we cannot fix.</p>
<p>IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled <code>button</code> elements, rendering text gray with a nasty text-shadow that we cannot fix.</p>
<h3>Multiple sizes</h3>
<hrclass="bs-docs-separator">
<h2>Button sizes</h2>
<p>Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.</p>
<p>Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.</p>
<p>For disabled buttons, add the <code>.disabled</code> class to links and the <code>disabled</code> attribute for <code><button></code> elements.</p>
<hrclass="bs-docs-separator">
<p>
<h2>Disabled state</h2>
<p>Make buttons look unclickable by fading them back 50%.</p>
<h3>Anchor element</h3>
<p>Add the <code>.disabled</code> class to <code><a></code> buttons.</p>
<p>{{_i}}Button styles can be applied to anything with the <code>.btn</code> class applied. However, typically you'll want to apply these to only <code><a></code> and <code><button></code> elements for the best rendering.{{/i}}</p>
<tableclass="table table-bordered table-striped">
<tableclass="table table-bordered table-striped">
<thead>
<thead>
<tr>
<tr>
...
@@ -1180,13 +1183,14 @@
...
@@ -1180,13 +1183,14 @@
</tbody>
</tbody>
</table>
</table>
<h3>{{_i}}Buttons for actions{{/i}}</h3>
<h4>{{_i}}Cross browser compatibility{{/i}}</h4>
<p>{{_i}}As a convention, buttons should only be used for actions while hyperlinks are to be used for objects. For instance, "Download" should be a button while "recent activity" should be a link.{{/i}}</p>
<p>{{_i}}Button styles can be applied to anything with the <code>.btn</code> class applied. However, typically you'll want to apply these to only <code><a></code> and <code><button></code> elements.{{/i}}</p>
<h3>{{_i}}Cross browser compatibility{{/i}}</h3>
<p>{{_i}}IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled <code>button</code> elements, rendering text gray with a nasty text-shadow that we cannot fix.{{/i}}</p>
<p>{{_i}}IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled <code>button</code> elements, rendering text gray with a nasty text-shadow that we cannot fix.{{/i}}</p>
<h3>{{_i}}Multiple sizes{{/i}}</h3>
<hrclass="bs-docs-separator">
<h2>{{_i}}Button sizes{{/i}}</h2>
<p>{{_i}}Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.{{/i}}</p>
<p>{{_i}}Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.{{/i}}</p>
<p>{{_i}}For disabled buttons, add the <code>.disabled</code> class to links and the <code>disabled</code> attribute for <code><button></code> elements.{{/i}}</p>
<hrclass="bs-docs-separator">
<p>
<h2>{{_i}}Disabled state{{/i}}</h2>
<p>{{_i}}Make buttons look unclickable by fading them back 50%.{{/i}}</p>
<h3>Anchor element</h3>
<p>{{_i}}Add the <code>.disabled</code> class to <code><a></code> buttons.{{/i}}</p>