HTML 中的 SUP 標籤將上標文字新增至 HTML 文件中。 SUP 是上標文字的縮寫。它在 HTML 語言中主要用於表示數學表達式和科學公式。 SUP 標籤的位置位於基線上其角色高度的一半位置。它專門用於印刷目的。此標籤的另一個用途是顯示腳註。
.. 之間包含的文字以內嵌文字格式顯示較小字體的上標文字。使用它來顯示指數是一種常見的做法,指示文字表示中數字的冪。 tag 沒有任何特殊屬性,但支援全域屬性和事件屬性。
文法:
要在 HTML 中使用sup標籤,請遵循以下語法:
<sup> text </sup>
52 = 25
您也可以使用sup標籤來顯示用於商業或產品目的的時尚文字標記。也可以使用 CSS 來完成;我們在此沒有使用sup 標籤。範例如下:
讓我們看看如何使用 來寫數學方程式標籤。一個例子包括各種數學公式,如下所示:
代碼:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> * { box-sizing: border-box; } .column { float: left; width: 40%; } </style> </head> <body> <div class="row"> <h2>Mathematical Equations</h2> <div class="column"> <h4>Mathematical formulas</h4> <p> <b> Area of Square :</b> A = l <sup> 2 </sup></p> <p> <b> Area of Circle :</b> A = 3.14 * r <sup> 2 </sup></p> <p> <b> Area of Sphere :</b> A = 4 * 3.14* 4 <sup> 2 </sup></p> <p> <b> Area of Cube :</b> V = s <sup> 3 </sup></p> <p> <b> Area of Cylinder :</b> V = 3.14 * r <sup>2</sup></p> <p> <b> Product :</b> A <sup> m </sup> * A <sup> n </sup> = a <sup>m + n</sup></p> <p> <b> Quotient :</b> A <sup> m </sup> / A <sup> n </sup> = a <sup>m - n</sup></p> <p> <b> Power of Power :</b> (a*b) <sup> n </sup> = a <sup> n </sup> * b <sup> n </sup> <p> <b> Power of Power :</b> (a/b) <sup> n </sup> = a <sup> n </sup> / b <sup>n</sup></p> <p> <b> Zero Exponents :</b> a <sup> 0 </sup> = 1</p> <br> </div> <div class="column" > <h4> Factoring formulas </h4> <p> <b> a<sup>2</sup> - b <sup>2</sup> = (a - b) * ( a + b ) </b> </p> <p> <b> a<sup>4</sup> - b <sup>4</sup> = (a - b) * ( a + b ) * (a <sup>2</sup> + b <sup>2</sup> ) </b> </p> <p> <b> a<sup>6</sup> - b <sup>6</sup> = (a - b) * ( a + b ) * (a <sup>2</sup> -ab + b <sup>2</sup> ) * (a <sup>2</sup> +ab + b <sup>2</sup> ) </b> </p> <p> <b> a<sup>3</sup> + b <sup>3</sup> = (a + b) * (a <sup>2</sup> -ab + b <sup>2</sup> ) </b> </p> <p> <b> a<sup>3</sup> - b <sup>3</sup> = (a - b) * (a <sup>2</sup> +ab + b <sup>2</sup> ) </b> </p> <p> <b>(a+b) <sup>2</sup> = a <sup>2</sup> + 2ab + b <sup>2</sup> </b> </p> <p> <b> (a-b) <sup>2</sup> = a <sup>2</sup> -2ab + b <sup>2</sup> </b> </p> <p> <b> (a+b+c) <sup>2</sup> = a <sup>2</sup> + b <sup>2</sup> + c <sup>2</sup> + 2(ab + bc + ca) </b> </p> <p> <b> (a+b) <sup>3</sup> = a <sup>3</sup> + b <sup>3</sup> + 3ab(a+b) </b> </p> <p> <b> (a-b) <sup>3</sup> = a <sup>3</sup> - b <sup>3</sup> - 3ab(a-b) </b> </p> </div> </div> </body> </html>
輸出:
顯示 中數字的平方和立方體;標籤。
代碼:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <h2>Squares and Cube of Numbers</h2> <h4>Numbers & its Square</h4> <p> <b> 1<sup> 2 </sup> = 1</b> </p> <p> <b> 2<sup> 2 </sup> = 4</b> </p> <p> <b> 3<sup> 2 </sup> = 9</b> </p> <p> <b> 4<sup> 2 </sup> = 16</b> </p> <p> <b> 5<sup> 2 </sup> = 25</b> </p> <h4>Numbers & its Cube</h4> <p> <b> 1<sup> 3 </sup> = 1</b> </p> <p> <b> 2<sup> 3 </sup> = 8</b> </p> <p> <b> 3<sup> 3 </sup> = 27</b> </p> <p> <b> 4<sup> 3 </sup> = 64</b> </p> <p> <b> 5<sup> 3 </sup> = 125</b> </p> </body> </html>
輸出:
標籤用於表示物理方程,如下所示。
代碼:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <h2>Physics Equations</h2> <p><b>Kinetic Energy formula E = 1/2 mv <sup> 2 </sup></b> </p> <p><b>Kinetic Elastic Energy formula E = 1/2 ke <sup> 2 </sup></b> </p> <p> <b> Enery of object: E= MC<sup> 2 </sup> </b> </p> <p><b>Power Current resistance formula = I<sup> 2 </sup> R</b> </p> <p><b> Formula for calculating velocity , distance and acceleration : v<sup> 2 </sup> - u <sub>2 </sub> =2as</b> </p> </body> </html>
輸出:
在這裡我們了解到 HTML 程式碼中的標籤代表其相關 HTML 文件中的上標文字。使用者主要將此標籤用於數學表達式、科學方程式和顯示語言縮寫。它提供的文字是低於正常行的一半,並且文字大小較小。
以上是HTML 中的 SUP 標籤的詳細內容。更多資訊請關注PHP中文網其他相關文章!