国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

目錄
代碼標(biāo)簽在 HTML 中如何工作？
實現(xiàn) HTML 代碼標(biāo)簽的示例
示例#5
Example #6
Conclusion
首頁 web前端 html教程 HTML 代碼標(biāo)簽

HTML 代碼標(biāo)簽

Sep 04, 2024 pm 04:28 PM
html html5 HTML Tutorial HTML Properties HTML tags

HTML 或超文本標(biāo)記語言是一種 Web 開發(fā)編程語言，它使用標(biāo)簽來定義、聲明和在任何網(wǎng)頁元素上執(zhí)行操作。標(biāo)簽使用符號 和 。 ……。 ，因為 HTML 中的每個標(biāo)簽都必須有一個結(jié)束標(biāo)簽。

語法及解釋：

基本語法如下所示，其中元素帶有一對，代碼片段寫在這些標(biāo)簽之間。這里不執(zhí)行標(biāo)簽省略，因為默認(rèn)情況下起始標(biāo)簽和結(jié)束標(biāo)簽都是必需的。

<pre class="brush:php;toolbar:false">
<code>
….
….
</code>

代碼標(biāo)簽在 HTML 中如何工作？

默認(rèn)情況下，的內(nèi)容是標(biāo)簽字體使用等寬字體顯示，這意味著給定內(nèi)容中的所有字符具有相同的寬度。它在 HTML 5 和 HTML4 標(biāo)準(zhǔn)中都有指定。

HTML 使用各種文本大小以及更多字體和縮進(jìn)屬性。有一種場景，需要在瀏覽器中顯示一些內(nèi)容，同時包含文本和代碼片段，那么我們就需要使用這個標(biāo)簽。代碼標(biāo)簽與預(yù)格式化標(biāo)簽 <pre class="brush:php;toolbar:false"> 配對，它保留了源文檔中寫入的文本的確切格式。</pre>

為了在同一行開始文本，使用了這個標(biāo)簽，它實際上刪除了空格。為了以字體樣式表示代碼，最好使用CSS樣式的代碼選擇器并給出視覺權(quán)重。要選擇字體，最好將 CSS 設(shè)置為等寬字體。瀏覽器兼容性方面，chrome、edge、opera、safari、Firefox 均支持。即使這個元素也支持事件和全局屬性。代碼標(biāo)簽使用預(yù)定義語言的類屬性以及 、

此代碼標(biāo)簽在實現(xiàn)時使用了一些元素。

  • : 定義代碼片段
  • : 解釋變量
  • ：拋出計算機輸出
  • ：幫助顯示鍵盤輸入

實現(xiàn) HTML 代碼標(biāo)簽的示例

這是代碼標(biāo)簽上具有不同樣式的示例。

示例#1

這里第一個示例程序是顯示代碼，這形成了基本的內(nèi)聯(lián)概念。

代碼：

<!DOCTYPE html>
<html>
<body>
<em># Display the sum</em><br>
<strong>program adds two numbers</strong><br>
<pre class="brush:php;toolbar:false">
<code>
nu1 = 2.5
nu2 = 5.3
sum = float(nu1) + float(nu2)
print('The sum of two num {0} and {1} is {2}'.format(nu1, nu2, sum))</code>

output from a program
input
Variable declaration

生成的輸出如下所示，它顯示了程序代碼的內(nèi)容以及使用 的輸出。網(wǎng)頁上的標(biāo)簽。為了換行片段的多行，計算機代碼

下面使用了元素。</samp></p>
<p><strong>輸出：</strong></p>
<p><img  src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/172543853827005.png" class="lazy" alt="HTML 代碼標(biāo)簽" ></p>
<p>使用多個<code>同一程序中的元素。</code></p>
<p><strong>代碼：</strong></p>
<pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<body>
<h1>Various Programming language</h1>
<h2> Java</h2>
<code>
import java.io.*;<br>
System.out.println();
</code>
<h2>C programming</h2>
<code>
#include <stdio.h><br>
void main()<br>
printf()
</code>
</body>
</html>

我們有一個小代碼快照，在網(wǎng)頁上顯示上述代碼的 Java 和 C 編程示例。

輸出：

HTML 代碼標(biāo)簽

示例#2

第二個示例顯示了一個示例程序，該程序以居中對齊方式顯示代碼。

代碼：

<!DOCTYPE html>
<html>
<body>
<code>
<center>
x = 3;
y = 2;
c = "To add a program";
</center>
</code>
</body>
</html>

輸出：

HTML 代碼標(biāo)簽

示例#3

此外，我還包括了

顯示程序以及描述內(nèi)容的概念（給出語義信息）。甚至我們可以在它們之間添加任何功能代碼以提供程序的好處。

代碼：

<!DOCTYPE html>
<h1>Demo of article tag</h1>
<p>The <code> fact()</code> this method is used to calculate a factorial of a given number.</p>

代碼：

code {
background-color: #8A2BE2;
border-radius: 2px;
font-family: "Courier New", monospace;
padding: 0 4px;
}

輸出：

HTML 代碼標(biāo)簽

示例#4

使用 href linkOutput 的 html 代碼格式。

代碼：

<!DOCTYPE html>
<h1>Demo of code tag</h1>
<p>This is an implementaion of a <a href="http://www.educba.com" title="online tutorial"><code>link to edu</code></a> displayed with code tag.</p>

代碼：

code {
background-color: #6495ED;
border-radius: 5px;
font-family: "italic", monospace;
padding: 1 5px;
}

輸出：

HTML 代碼標(biāo)簽

示例#5

為了正確地編寫代碼并查看和閱讀時尚，我們必須使用