如何在 HTML 輸入框中顯示化學式?
在 HTML 中,為了在 HTML 輸入框中顯示化學式,我們將使用下標和上標標籤。讓我們考慮一個簡單的例子。
Chemical formula of water is H2O
對於上面提到的,我們將應用 HTML 上標和下標標籤來獲得如上所述的化學式的輸出。
Chemical formula of water is H<sub>2</sub>O
讓我們深入閱讀以下文章,以便更好地理解如何在 HTML 輸入框中顯示化學式。
HTML 下標
HTML 元素 <sub> 標籤用於指定應純粹出於排版目的而顯示為下標的內聯文字。下標通常以較小的字型和較低的基線顯示。
HTML 上標
HTML 元素 <sup> 標籤用於指定應純粹出於排版目的而顯示為上標的內聯文字。上標通常以較小的字型和較高的基線顯示。
為了獲得更多關於如何在 HTML 輸入框中顯示化學式的想法。讓我們看看下面的例子
示例
在下面的示例中,我們使用下標來編寫硫酸的化學式。
<!DOCTYPE html>
<html>
<body>
<style>
body{
text-align: center;
background-color:#EAFAF1;
}
p{
color: #8E44AD ;
}
</style>
<p>Chemical Formula of Sulphuric Acid: H<sub>2</sub>SO<sub>4</sub></p>
</body>
</html>
當指令碼執行時,它將生成一個輸出,其中包含使用指令碼在網頁上顯示的硫酸化學式。
示例
考慮以下示例,其中我們使用上標來編寫錫離子 (Sn2+) 的化學式。
<!DOCTYPE html>
<html>
<body style="background-color:#D5DBDB ">
<style>
.tutorial {
position: absolute
}
.place {
position:relative; left: 40px;
}
</style>
<span class='tutorial'>
<span class='place'><b>Sn</b><sup>2+</sup>
</span>
</span>
</body>
</html>
執行上述指令碼後,輸出視窗將彈出,在使用 **上標標籤** 獲得的網頁上顯示錫離子的化學式。
示例
讓我們考慮以下示例,其中我們使用上標和下標來編寫內軌絡合物的化學式。
<!DOCTYPE html>
<html>
<body style="background-color:#F4ECF7 ">
<p>
<strong>Example of the inner orbital complex:
[Co(NH<sub>3</sub>)<sub>6</sub>]<sup>3+ </sup></strong>
</p>
</body>
</html>
當指令碼執行時,它將生成一個輸出,其中包含使用 **上標** 和下標在網頁上顯示的內軌絡合物示例。
廣告
資料結構
網路
關係型資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP