bootstrap基础学习四篇

bootstrap代码

Bootstrap 允许两种方式显示代码：

• 第一种是 <code> 标签。如果您想要内联显示代码，那么您应该使用 <code> 标签。
• 第二种是 <pre> 标签。如果代码需要被显示为一个独立的块元素或者代码有多行，那么您应该使用 <pre> 标签。

请确保当您使用 <pre> 和 <code> 标签时，开始和结束标签使用了 unicode 变体： &lt; 和 &gt;。

1.代码如下：

 <div class="container">
           <p>
               <code>
                   123456<br/>
                   &lt;header&gt;这是一个例子
               </code>
           </p>

           <p>
               <pre>
                   asdfghjkl<br/>
                   &lt;h1&gt;8678678768
               </pre>
           </p>
     </div>

2.效果：

aaarticlea/png;base64,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" alt="" />