Bootstrapの写真は順番に放送します。

46653 ワード

Bootstrapはcarouselプラグインを提供しています。
コード
<code class="hljs xml has-numbering" style="display: block;
 padding: 0px; color: inherit; box-sizing: border-box;
 font-family: 'Source Code Pro', monospace;font-size:undefined;
 white-space: pre; border-radius: 0px; word-wrap: normal; 
background: transparent;"><span class="hljs-doctype" style="color: rgb(102, 0, 102); 
box-sizing: border-box;"><!DOCTYPE html></span> 
<span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">html</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">lang</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"en"</span>></span> 
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">head</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">meta</span> <span class="hljs-attribute" 
style="box-sizing: border-box; 
color: rgb(102, 0, 102);">charset</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"UTF-8"</span>></span>
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">title</span>></span>Document<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">title</span>></span>
    <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">link</span>
 <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">href</span>=<span class="hljs-value" 
style="box-sizing: border-box;
 color: rgb(0, 136, 0);">"http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css"</span>
 <span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">rel</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"stylesheet"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span> 
<span class="hljs-attribute" 
style="box-sizing: border-box; 
color: rgb(102, 0, 102);">src</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"http://libs.baidu.com/jquery/2.0.0/jquery.min.js"</span>></span>
<span class="javascript" style="box-sizing: border-box;"></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">script</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">src</span>=<span class="hljs-value" 
style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"</span>></span>
<span class="javascript" style="box-sizing: border-box;"></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">style</span> <span class="hljs-attribute" 
style="box-sizing: border-box; 
color: rgb(102, 0, 102);">type</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"text/css"</span>></span>
<span class="css" style="box-sizing: border-box;"> 
 <span class="hljs-tag" style="color: rgb(0, 0, 0); 
box-sizing: border-box;">img</span><span class="hljs-rules" 
style="box-sizing: border-box;">{
           <span class="hljs-rule" 
style="box-sizing: border-box;">
<span class="hljs-attribute" 
style="box-sizing: border-box;">margin</span>:<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 102, 102);">
<span class="hljs-number" style="box-sizing: border-box;">0</span> auto</span></span>; 
 <span class="hljs-rule" style="box-sizing: border-box;">}</span></span>
   </span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">style</span>></span> 
<span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">head</span>></span>
<span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">body</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">id</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel-example-generic"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel slide"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-ride</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel"</span>></span> 
 <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">
<!-- Indicators --></span>
  <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">ol</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel-indicators"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">li</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">data-target</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"#carousel-example-generic"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-slide-to</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"0"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"active"</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">li</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">li</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-target</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"#carousel-example-generic"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-slide-to</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"1"</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">li</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">li</span>
 <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-target</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"#carousel-example-generic"</span>
 <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">data-slide-to</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"2"</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title"
 style="box-sizing: border-box; color: rgb(0, 0, 136);">li</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">ol</span>></span> 
 <span class="hljs-comment" style="color: rgb(136, 0, 0);
 box-sizing: border-box;"><!-- Wrapper for slides --></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">div</span> <span class="hljs-attribute" 
style="box-sizing: border-box; 
color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel-inner"</span> 
<span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">role</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"listbox"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">div</span> <span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" style="box-sizing: border-box;
 color: rgb(0, 136, 0);">"item active"</span>></span>
      <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">img</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">src</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"images/lunbo1.jpg"</span> <span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">height</span>=<span class="hljs-value" style="box-sizing: border-box;
 color: rgb(0, 136, 0);">"266"</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">width</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"800"</span> <span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">alt</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"..."</span>></span>
      <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">div</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"carousel-caption"</span>></span>
        ...
      <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">div</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">div</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">div</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"item"</span>></span>
      <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">img</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">src</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"images/lunbo2.jpg"</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">height</span>=<span class="hljs-value"
 style="box-sizing: border-box; color: rgb(0, 136, 0);">"266"</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">width</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"800"</span> <span class="hljs-attribute"
 style="box-sizing: border-box; color: rgb(102, 0, 102);">alt</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"..."</span>></span>
      <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">div</span> <span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"carousel-caption"</span>></span>
        ...
      <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span>></span>
    <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"item"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">img</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">src</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"images/lunbo3.jpg"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">height</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"266"</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">width</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"800"</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">alt</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"..."</span>></span>
      <span class="hljs-tag" style="color: rgb(0, 102, 102);
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel-caption"</span>></span>
        ... 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span>></span>
    <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">div</span>></span>
    ...
  <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box;
 color: rgb(0, 0, 136);">div</span>></span>

  <span class="hljs-comment" style="color: rgb(136, 0, 0);
 box-sizing: border-box;"><!-- Controls --></span>
  <span class="hljs-tag" style="color: rgb(0, 102, 102); 
box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">a</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"left carousel-control"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">href</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"#carousel-example-generic"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">role</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"button"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">data-slide</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"prev"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"glyphicon glyphicon-chevron-left"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">aria-hidden</span>=<span 
class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"true"</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
</<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=<span
class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"sr-only"</span>></span>Previous<span 
class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span>></span>
  <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">a</span>></span>
  <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">a</span> <span class="hljs-attribute" style="box-sizing: border-box; 
color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" style="box-sizing: border-box;
 color: rgb(0, 136, 0);">"right carousel-control"</span> <span class="hljs-attribute" 
style="box-sizing: border-box; color: rgb(102, 0, 102);">href</span>=<span class="hljs-value" 
style="box-sizing: border-box; color: rgb(0, 136, 0);">"#carousel-example-generic"</span> 
<span class="hljs-attribute" style="box-sizing: border-box;
 color: rgb(102, 0, 102);">role</span>=<span class="hljs-value" style="box-sizing: border-box; 
color: rgb(0, 136, 0);">"button"</span> <span class="hljs-attribute" style="box-sizing: border-box;
color: rgb(102, 0, 102);">data-slide</span>=<span class="hljs-value" style="box-sizing: border-box;
 color: rgb(0, 136, 0);">"next"</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102);
 box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"glyphicon glyphicon-chevron-right"</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">aria-hidden</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"true"</span>></span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"sr-only"</span>></span>Next<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">span</span>></span>
  <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">a</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">body</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">html</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li><li style="box-sizing: border-box; padding: 0px 5px;">16</li><li style="box-sizing: border-box; padding: 0px 5px;">17</li><li style="box-sizing: border-box; padding: 0px 5px;">18</li><li style="box-sizing: border-box; padding: 0px 5px;">19</li><li style="box-sizing: border-box; padding: 0px 5px;">20</li><li style="box-sizing: border-box; padding: 0px 5px;">21</li><li style="box-sizing: border-box; padding: 0px 5px;">22</li><li style="box-sizing: border-box; padding: 0px 5px;">23</li><li style="box-sizing: border-box; padding: 0px 5px;">24</li><li style="box-sizing: border-box; padding: 0px 5px;">25</li><li style="box-sizing: border-box; padding: 0px 5px;">26</li><li style="box-sizing: border-box; padding: 0px 5px;">27</li><li style="box-sizing: border-box; padding: 0px 5px;">28</li><li style="box-sizing: border-box; padding: 0px 5px;">29</li><li style="box-sizing: border-box; padding: 0px 5px;">30</li><li style="box-sizing: border-box; padding: 0px 5px;">31</li><li style="box-sizing: border-box; padding: 0px 5px;">32</li><li style="box-sizing: border-box; padding: 0px 5px;">33</li><li style="box-sizing: border-box; padding: 0px 5px;">34</li><li style="box-sizing: border-box; padding: 0px 5px;">35</li><li style="box-sizing: border-box; padding: 0px 5px;">36</li><li style="box-sizing: border-box; padding: 0px 5px;">37</li><li style="box-sizing: border-box; padding: 0px 5px;">38</li><li style="box-sizing: border-box; padding: 0px 5px;">39</li><li style="box-sizing: border-box; padding: 0px 5px;">40</li><li style="box-sizing: border-box; padding: 0px 5px;">41</li><li style="box-sizing: border-box; padding: 0px 5px;">42</li><li style="box-sizing: border-box; padding: 0px 5px;">43</li><li style="box-sizing: border-box; padding: 0px 5px;">44</li><li style="box-sizing: border-box; padding: 0px 5px;">45</li><li style="box-sizing: border-box; padding: 0px 5px;">46</li><li style="box-sizing: border-box; padding: 0px 5px;">47</li><li style="box-sizing: border-box; padding: 0px 5px;">48</li><li style="box-sizing: border-box; padding: 0px 5px;">49</li><li style="box-sizing: border-box; padding: 0px 5px;">50</li><li style="box-sizing: border-box; padding: 0px 5px;">51</li><li style="box-sizing: border-box; padding: 0px 5px;">52</li><li style="box-sizing: border-box; padding: 0px 5px;">53</li><li style="box-sizing: border-box; padding: 0px 5px;">54</li><li style="box-sizing: border-box; padding: 0px 5px;">55</li><li style="box-sizing: border-box; padding: 0px 5px;">56</li><li style="box-sizing: border-box; padding: 0px 5px;">57</li><li style="box-sizing: border-box; padding: 0px 5px;">58</li><li style="box-sizing: border-box; padding: 0px 5px;">59</li></ul>
効果
オプションのパラメータ
data-ride=「carousel」:自動で再生できます。クリックしないと再生できます。タイトルを追加  タイトルは  <div class="carousel-caption"></div>間 
<code class="hljs xml has-numbering" 
style="display: block; padding: 0px; color: inherit; box-sizing: border-box; 
font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; 
background: transparent;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span> 
<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span>=
<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"carousel-caption"</span>></span> 
 <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;">
<<span class="hljs-title" style="box-sizing: border-box; 
color: rgb(0, 0, 136);">h3</span>></span>        <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">h3</span>></span>
     <span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">p</span>></span>    、    
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">p</span>></span>
<span class="hljs-tag" 
style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" 
style="box-sizing: border-box; color: rgb(0, 0, 136);">div</span>></span></code>