<pre><code> </code></pre>
共同点:都主要应用于浏览器显示计算机中的源代码。
不同点:code标签的一个功能是暗示浏览器code标签所包围的文本是计算机源代码,浏览器可以做出自己的
样式处理,pre标签则没有这项功能,但是pre标签可以保留文本中的空格和换行符,保留文本中的空格和换行符是计算机源代码显示 所必须的样式。code标签和pre标签是
可以嵌套使用的,但是必须注意两者的嵌套顺序。
来源:zj_zxj
<pre class="language-html"><code class="language-html">
<p>用于展示缩写词,鼠标浮动会展示出完整词 <br />
The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.
</p></code>
</pre>
随机图片
<figure>
<img src="https://picsum.photos/1000/300" alt="随机图片尺寸为1000*300" />
<figcaption>随机图片</figcaption>
</figure>
< class="inner">
Copyright 1999-2011.
- by Refsnes Data. All Rights Reserved.
All content and graphics on this web site are the property of the company Refsnes Data.
<details><summary>Copyright 1999-2011.</summary>
<p> - by Refsnes Data. All Rights Reserved.<br/>
All content and graphics on this web site are the property of the company Refsnes Data.</p>
<
用于展示缩写词,鼠标浮动会展示出完整词 The WHO was founded in
1948.
<p>用于展示缩写词,鼠标浮动会展示出完整词 <br />
The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.
</p>
Coffee
Tea
Milk
List item...1
List item...2
List item...3
Coffee
Tea
Milk
<ol style="list-style-type:lower-alpha">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol reversed>
<li>List item...1</li>
<li>List item...2</li>
<li>List item...3</li>
</ol>
<ol start="5">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
ol.a {list-style-type: armenian;}
ol.b {list-style-type: cjk-ideographic;}
ol.c {list-style-type: decimal;}
ol.d {list-style-type: decimal-leading-zero;}
ol.e {list-style-type: georgian;}
ol.f {list-style-type: hebrew;}
ol.g {list-style-type: hiragana;}
ol.h {list-style-type: hiragana-iroha;}
ol.i {list-style-type: katakana;}
ol.j {list-style-type: katakana-iroha;}
ol.k {list-style-type: lower-alpha;}
ol.l {list-style-type: lower-greek;}
ol.m {list-style-type: lower-latin;}
ol.n {list-style-type: lower-roman;}
ol.o {list-style-type: upper-alpha;}
ol.p {list-style-type: upper-latin;}
ol.q {list-style-type: upper-roman;}
ol.r {list-style-type: none;}
ol.s {list-style-type: inherit;}