Skip to content

Commit 4d0a80b

Browse files
fatfat
committed
Merge branch 'master' of github.com:twitter/bootstrap
2 parents 581f256 + 0af179f commit 4d0a80b

File tree

1 file changed

+158
-157
lines changed

1 file changed

+158
-157
lines changed

‎docs/index.html

Lines changed: 158 additions & 157 deletions
Original file line numberDiff line numberDiff line change
@@ -288,15 +288,16 @@ <h4>When to use</h4>
288288
<p>Emphasis tags (<code>&lt;strong&gt;</code> and <code>&lt;em&gt;</code>) should be used to add visual distinction between a word or phrase and its surrounding copy. Use <code>&lt;strong&gt;</code> for plain old attention and <code>&lt;em&gt;</code> for <em>slick</em> attention and titles.</p>
289289
<h3>Emphasis in a paragraph</h3>
290290
<p><a href="">Fusce dapibus</a>, <strong>tellus ac cursus commodo</strong>, <em>tortor mauris condimentum nibh</em>, ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue.</p>
291+
<p><strong>Note:</strong> It's still okay to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> tags in HTML5, but they don't come with inherent styles anymore. <code>&lt;b&gt;</code> is meant to convey importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
291292
<h3>Addresses</h3>
292-
<p>The <code>address</code> element is used for&mdash;you guessed it!&mdash;addresses. Here's how it looks:</p>
293+
<p>The <code>address</code> element is used for contact information for its nearest ancestor, or the entire body of work. Here's how it looks:</p>
293294
<address>
294-
<strong>Twitter, Inc.</strong><br />
295-
795 Folsom Ave, Suite 600<br />
296-
San Francisco, CA 94107<br />
297-
<abbr title="Phone">P:</abbr> (123) 456-7890
295+
<strong>Twitter, Inc.</strong><br />
296+
795 Folsom Ave, Suite 600<br />
297+
San Francisco, CA 94107<br />
298+
<abbr title="Phone">P:</abbr> (123) 456-7890
298299
</address>
299-
<p><strong>Note:</strong> Each line in an <code>address</code> must end with a line-break (<code>&lt;br /&gt;</code>) to properly structure the content as it is read in real life without any styles applied.</p>
300+
<p><strong>Note:</strong> Each line in an <code>address</code> must end with a line-break (<code>&lt;br /&gt;</code>) or be wrapped in a block-level tag (e.g., <code>p</code>) to properly structure the content.</p>
300301
<h3>Abbreviations</h3>
301302
<p>For abbreviations and acronyms, use the <code>abbr</code> tag (<code>acronym</code> is deprecated in <abbr title="HyperText Markup Langugage 5">HTML5</abbr>). Put the shorthand form within the tag and set a title for the complete name.</p>
302303
</div>
@@ -308,14 +309,14 @@ <h2>Blockquotes</h2>
308309
<p>
309310
<code>&lt;blockquote&gt;</code>
310311
<code>&lt;p&gt;</code>
311-
<code>&lt;cite&gt;</code>
312+
<code>&lt;small&gt;</code>
312313
</p>
313314
</div>
314315
<div class="span12 columns">
315-
<p>Be sure to wrap your <code>blockquote</code> around <code>paragraph</code> and <code>cite</code> tags. When citing a source, use the <code>cite</code> element. The CSS will automatically preface a name with an em dash (&amp;mdash;).</p>
316+
<p>Be sure to wrap your <code>blockquote</code> around <code>paragraph</code> and <code>small</code> tags. When citing a source, use the <code>small</code> element. The CSS will automatically preface a name with an em dash (&amp;mdash;).</p>
316317
<blockquote>
317-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua...</p>
318-
<cite>Dr. Julius Hibbert</cite>
318+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua...</p>
319+
<small>Dr. Julius Hibbert</small>
319320
</blockquote>
320321
</div>
321322
</div>
@@ -324,78 +325,78 @@ <h2>Blockquotes</h2>
324325
<h2>Lists</h2>
325326
<div class="row">
326327
<div class="span4 columns">
327-
<h4>Unordered <code>&lt;ul&gt;</code></h4>
328-
<ul>
329-
<li>Jeremy Bixby</li>
330-
<li>Robert Dezure</li>
331-
<li>Josh Washington</li>
332-
<li>Anton Capresi</li>
333-
<li>My Team Mates
334-
<ul>
335-
<li>George Castanza</li>
336-
<li>Jerry Seinfeld</li>
337-
<li>Cosmo Kramer</li>
338-
<li>Elaine Bennis</li>
339-
<li>Newman</li>
340-
</ul>
341-
</li>
342-
<li>John Jacob</li>
343-
<li>Paul Pierce</li>
344-
<li>Kevin Garnett</li>
345-
</ul>
328+
<h4>Unordered <code>&lt;ul&gt;</code></h4>
329+
<ul>
330+
<li>Jeremy Bixby</li>
331+
<li>Robert Dezure</li>
332+
<li>Josh Washington</li>
333+
<li>Anton Capresi</li>
334+
<li>My Team Mates
335+
<ul>
336+
<li>George Castanza</li>
337+
<li>Jerry Seinfeld</li>
338+
<li>Cosmo Kramer</li>
339+
<li>Elaine Bennis</li>
340+
<li>Newman</li>
341+
</ul>
342+
</li>
343+
<li>John Jacob</li>
344+
<li>Paul Pierce</li>
345+
<li>Kevin Garnett</li>
346+
</ul>
346347
</div>
347348
<div class="span4 columns">
348-
<h4>Unstyled <code>&lt;ul.unstyled&gt;</code></h4>
349-
<ul class="unstyled">
350-
<li>Jeremy Bixby</li>
351-
<li>Robert Dezure</li>
352-
<li>Josh Washington</li>
353-
<li>Anton Capresi</li>
354-
<li>My Team Mates
355-
<ul>
356-
<li>George Castanza</li>
357-
<li>Jerry Seinfeld</li>
358-
<li>Cosmo Kramer</li>
359-
<li>Elaine Bennis</li>
360-
<li>Newman</li>
361-
</ul>
362-
</li>
363-
<li>John Jacob</li>
364-
<li>Paul Pierce</li>
365-
<li>Kevin Garnett</li>
366-
</ul>
349+
<h4>Unstyled <code>&lt;ul.unstyled&gt;</code></h4>
350+
<ul class="unstyled">
351+
<li>Jeremy Bixby</li>
352+
<li>Robert Dezure</li>
353+
<li>Josh Washington</li>
354+
<li>Anton Capresi</li>
355+
<li>My Team Mates
356+
<ul>
357+
<li>George Castanza</li>
358+
<li>Jerry Seinfeld</li>
359+
<li>Cosmo Kramer</li>
360+
<li>Elaine Bennis</li>
361+
<li>Newman</li>
362+
</ul>
363+
</li>
364+
<li>John Jacob</li>
365+
<li>Paul Pierce</li>
366+
<li>Kevin Garnett</li>
367+
</ul>
367368
</div>
368369
<div class="span4 columns">
369370
<h4>Ordered <code>&lt;ol&gt;</code></h4>
370371
<ol>
371-
<li>Jeremy Bixby</li>
372-
<li>Robert Dezure</li>
373-
<li>Josh Washington</li>
374-
<li>Anton Capresi</li>
375-
<li>My Team Mates
376-
<ol>
377-
<li>George Castanza</li>
378-
<li>Jerry Seinfeld</li>
379-
<li>Cosmo Kramer</li>
380-
<li>Elaine Bennis</li>
381-
<li>Newman</li>
382-
</ol>
383-
</li>
384-
<li>John Jacob</li>
385-
<li>Paul Pierce</li>
386-
<li>Kevin Garnett</li>
372+
<li>Jeremy Bixby</li>
373+
<li>Robert Dezure</li>
374+
<li>Josh Washington</li>
375+
<li>Anton Capresi</li>
376+
<li>My Team Mates
377+
<ol>
378+
<li>George Castanza</li>
379+
<li>Jerry Seinfeld</li>
380+
<li>Cosmo Kramer</li>
381+
<li>Elaine Bennis</li>
382+
<li>Newman</li>
383+
</ol>
384+
</li>
385+
<li>John Jacob</li>
386+
<li>Paul Pierce</li>
387+
<li>Kevin Garnett</li>
387388
</ol>
388389
</div>
389390
<div class="span4 columns">
390391
<h4>Description <code>dl</code></h4>
391392
<dl>
392-
<dt>Description lists</dt>
393-
<dd>A description list is perfect for defining terms.</dd>
394-
<dt>Euismod</dt>
395-
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
396-
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
397-
<dt>Malesuada porta</dt>
398-
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
393+
<dt>Description lists</dt>
394+
<dd>A description list is perfect for defining terms.</dd>
395+
<dt>Euismod</dt>
396+
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
397+
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
398+
<dt>Malesuada porta</dt>
399+
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
399400
</dl>
400401
</div>
401402
</div>
@@ -429,34 +430,34 @@ <h2>Building tables</h2>
429430
<h3>Example: Default table styles</h3>
430431
<p>All tables will be automatically styled with only the essential borders to ensure readability and maintain structure. No need to add extra classes or attributes.</p>
431432
<table>
432-
<thead>
433-
<tr>
434-
<th>#</th>
435-
<th>First Name</th>
436-
<th>Last Name</th>
437-
<th>Language</th>
438-
</tr>
439-
</thead>
440-
<tbody>
441-
<tr>
442-
<td>1</td>
443-
<td>Some</td>
444-
<td>One</td>
445-
<td>English</td>
446-
</tr>
447-
<tr>
448-
<td>2</td>
449-
<td>Joe</td>
450-
<td>Sixpack</td>
451-
<td>English</td>
452-
</tr>
453-
<tr>
454-
<td>3</td>
455-
<td>Stu</td>
456-
<td>Dent</td>
457-
<td>Code</td>
458-
</tr>
459-
</tbody>
433+
<thead>
434+
<tr>
435+
<th>#</th>
436+
<th>First Name</th>
437+
<th>Last Name</th>
438+
<th>Language</th>
439+
</tr>
440+
</thead>
441+
<tbody>
442+
<tr>
443+
<td>1</td>
444+
<td>Some</td>
445+
<td>One</td>
446+
<td>English</td>
447+
</tr>
448+
<tr>
449+
<td>2</td>
450+
<td>Joe</td>
451+
<td>Sixpack</td>
452+
<td>English</td>
453+
</tr>
454+
<tr>
455+
<td>3</td>
456+
<td>Stu</td>
457+
<td>Dent</td>
458+
<td>Code</td>
459+
</tr>
460+
</tbody>
460461
</table>
461462
<pre class="prettyprint linenums">
462463
&lt;table class="common-table"&gt;
@@ -466,34 +467,34 @@ <h3>Example: Default table styles</h3>
466467
<h3>Example: Zebra-striped</h3>
467468
<p>Get a little fancy with your tables by adding zebra-striping&mdash;just add the <code>.zebra-striped</code> class.</p>
468469
<table class="zebra-striped">
469-
<thead>
470-
<tr>
471-
<th>#</th>
472-
<th>First Name</th>
473-
<th>Last Name</th>
474-
<th>Language</th>
475-
</tr>
476-
</thead>
477-
<tbody>
478-
<tr>
479-
<td>1</td>
480-
<td>Some</td>
481-
<td>One</td>
482-
<td>English</td>
483-
</tr>
484-
<tr>
485-
<td>2</td>
486-
<td>Joe</td>
487-
<td>Sixpack</td>
488-
<td>English</td>
489-
</tr>
490-
<tr>
491-
<td>3</td>
492-
<td>Stu</td>
493-
<td>Dent</td>
494-
<td>Code</td>
495-
</tr>
496-
</tbody>
470+
<thead>
471+
<tr>
472+
<th>#</th>
473+
<th>First Name</th>
474+
<th>Last Name</th>
475+
<th>Language</th>
476+
</tr>
477+
</thead>
478+
<tbody>
479+
<tr>
480+
<td>1</td>
481+
<td>Some</td>
482+
<td>One</td>
483+
<td>English</td>
484+
</tr>
485+
<tr>
486+
<td>2</td>
487+
<td>Joe</td>
488+
<td>Sixpack</td>
489+
<td>English</td>
490+
</tr>
491+
<tr>
492+
<td>3</td>
493+
<td>Stu</td>
494+
<td>Dent</td>
495+
<td>Code</td>
496+
</tr>
497+
</tbody>
497498
</table>
498499
<pre class="prettyprint linenums">
499500
&lt;table class="common-table zebra-striped"&gt;
@@ -503,34 +504,34 @@ <h3>Example: Zebra-striped</h3>
503504
<h3>Example: Zebra-striped w/ TableSorter.js</h3>
504505
<p>Taking the previous example, we improve the usefulness of our tables by providing sorting functionality via <a href="http://jquery.com">jQuery</a> and the <a href="http://tablesorter.com/docs/">Tablesorter</a> plugin. <strong>Click any column's header to change the sort.</strong></p>
505506
<table class="zebra-striped" id="sortTableExample">
506-
<thead>
507-
<tr>
508-
<th>#</th>
509-
<th class="yellow">First Name</th>
510-
<th class="blue">Last Name</th>
511-
<th class="green">Language</th>
512-
</tr>
513-
</thead>
514-
<tbody>
515-
<tr>
516-
<td>1</td>
517-
<td>Your</td>
518-
<td>One</td>
519-
<td>English</td>
520-
</tr>
521-
<tr>
522-
<td>2</td>
523-
<td>Joe</td>
524-
<td>Sixpack</td>
525-
<td>English</td>
526-
</tr>
527-
<tr>
528-
<td>3</td>
529-
<td>Stu</td>
530-
<td>Dent</td>
531-
<td>Code</td>
532-
</tr>
533-
</tbody>
507+
<thead>
508+
<tr>
509+
<th>#</th>
510+
<th class="yellow">First Name</th>
511+
<th class="blue">Last Name</th>
512+
<th class="green">Language</th>
513+
</tr>
514+
</thead>
515+
<tbody>
516+
<tr>
517+
<td>1</td>
518+
<td>Your</td>
519+
<td>One</td>
520+
<td>English</td>
521+
</tr>
522+
<tr>
523+
<td>2</td>
524+
<td>Joe</td>
525+
<td>Sixpack</td>
526+
<td>English</td>
527+
</tr>
528+
<tr>
529+
<td>3</td>
530+
<td>Stu</td>
531+
<td>Dent</td>
532+
<td>Code</td>
533+
</tr>
534+
</tbody>
534535
</table>
535536
<pre class="prettyprint linenums">
536537
&lt;script src="js/jquery/jquery.tablesorter.min.js"&gt;&lt;/script&gt;
@@ -808,8 +809,8 @@ <h2>Buttons</h2>
808809
<h3>Example buttons</h3>
809810
<p>Button styles can be applied to anything with the <code>.btn</code> applied. Typically you'll want to apply these to only <code>a</code>, <code>button</code>, and select <code>input</code> elements. Here's how it looks:</p>
810811
<div class="well" style="padding: 14px 19px;">
811-
<button type="submit" class="btn primary">Submit</button>
812-
<button type="submit" class="btn">Cancel</button>
812+
<button type="submit" class="btn primary">Submit</button>
813+
<button type="submit" class="btn">Cancel</button>
813814
</div>
814815
<h3>Alternate sizes</h3>
815816
<p>Fancy larger or smaller buttons? Have at it!</p>

0 commit comments

Comments
 (0)