From 3c880e681d49ade20f1b9fcbfb573172d24b3b89 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 16 Aug 2013 13:30:33 -0700 Subject: finish up second pass through docs nav, headings, organization, naming, etc (another run through at #9710) --- css.html | 42 +++++++++++++++++++++--------------------- 1 file changed, 21 insertions(+), 21 deletions(-) (limited to 'css.html') diff --git a/css.html b/css.html index 305d9f78c..ad48dcb09 100644 --- a/css.html +++ b/css.html @@ -15,7 +15,7 @@ base_url: "../"

Get the lowdown on the key pieces of Bootstrap's infrastructure, including our approach to better, faster, stronger web development.

-

HTML5 doctype required

+

HTML5 doctype

Bootstrap makes use of certain HTML elements and CSS properties that require the use of the HTML5 doctype. Include it at the beginning of all your projects.

{% highlight html %} @@ -51,10 +51,10 @@ base_url: "../"

These styles can be found within scaffolding.less.

-

Normalize reset

+

Normalize

For improved cross-browser rendering, we use Normalize, a project by Nicolas Gallagher and Jonathan Neal.

-

Centering with container

+

Containers

Easily center a page's contents by wrapping its contents in a .container. Containers set max-width at various media query breakpoints to match our grid system.

{% highlight html %}
@@ -249,7 +249,7 @@ base_url: "../"
{% endhighlight %} -

Example: Combining mobile with desktop

+

Example: Mobile and desktop

Don't want your columns to simply stack in smaller devices? Use the extra small and medium device grid classes by adding .col-xs-* .col-md-* to your columns. See the example below for a better idea of how it all works.

@@ -287,7 +287,7 @@ base_url: "../"
{% endhighlight %} -

Example: Mobile, tablet, and desktop

+

Example: Mobile, tablet, desktops

Build on the previous example by creating even more dynamic and powerful layouts with tablet .col-sm-* classes.

@@ -1061,10 +1061,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Optional classes

-

Add any of the following classes to the .table base class.

- -

Striped

+

Striped rows

Use .table-striped to add zebra-striping to any table row within the <tbody>.

Cross-browser compatibility

@@ -1108,7 +1105,8 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Bordered

+ +

Bordered table

Add .table-bordered for borders on all sides of the table and cells.

@@ -1152,7 +1150,8 @@ For example, <section> should be wrapped as inline.
{% endhighlight %} -

Hover rows

+ +

Hover rows

Add .table-hover to enable a hover state on table rows within a <tbody>.

@@ -1192,7 +1191,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Condensed

+

Condensed table

Add .table-condensed to make tables more compact by cutting cell padding in half.

@@ -1233,7 +1232,7 @@ For example, <section> should be wrapped as inline. -

Contextual table classes

+

Contextual classes

Use contextual classes to color table rows or individual cells.

@@ -1406,7 +1405,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Inline form

+

Inline form

Add .form-inline for left-aligned and inline-block controls for a compact layout.

Requires custom widths

@@ -1451,6 +1450,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} +

Horizontal form

Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding .form-horizontal to the form. Doing so changes .form-groups to behave as grid rows, so no need for .row.

@@ -1513,7 +1513,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Supported form controls

+

Supported controls

Examples of standard form controls supported in an example form layout.

Inputs

@@ -1647,8 +1647,8 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Static text in horizontal forms

-

When you need to place regular, static text next to a form label within a horizontal form, use the .form-control-static class on a <p>.

+

Static control

+

When you need to place plain text next to a form label within a horizontal form, use the .form-control-static class on a <p>.

@@ -1681,7 +1681,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Form control states

+

Form states

Provide feedback to users or visitors with basic feedback states on form controls and labels.

Input focus

@@ -1873,7 +1873,7 @@ For example, <section> should be wrapped as inline.

Buttons

-

Button options

+

Options

Use any of the available button classes to quickly create a styled button.

@@ -1907,7 +1907,7 @@ For example, <section> should be wrapped as inline. {% endhighlight %} -

Button sizes

+

Sizes

Fancy larger or smaller buttons? Add .btn-lg, .btn-sm, or .btn-xs for additional sizes.

@@ -1997,7 +1997,7 @@ For example, <section> should be wrapped as inline.

-

Using multiple tags

+

Button tags

Use the button classes on an <a>, <button>, or <input> element.

Link -- cgit v1.2.3