SUP-Tag in HTML

WBOY
Freigeben: 2024-09-04 16:26:06
Original
1217 Leute haben es durchsucht

SUP-Tag in HTML fügt dem HTML-Dokument hochgestellten Text hinzu. SUP ist eine Abkürzung für hochgestellten Text. Es wird hauptsächlich in HTML-Sprachen zur Darstellung mathematischer Ausdrücke und wissenschaftlicher Formeln verwendet. Die Platzierung des SUP-Tags erfolgt in der halben Position der Höhe seines Zeichens auf der Grundlinie. Es dient ausschließlich typografischen Zwecken. Eine weitere Verwendung dieses Tags ist die Anzeige von Fußnoten.

Der Text zwischen .. Zeigt hochgestellten Text in kleineren Schriftgrößen im Inline-Textformat an. Es ist eine gängige Praxis, es zur Anzeige von Exponenten zu verwenden, die die Potenz von Zahlen in der Textdarstellung angeben. Tag hat keine speziellen Attribute, unterstützt aber globale und Ereignisattribute.

Syntax:

Um das sup-Tag in HTML zu verwenden, befolgen Sie die folgende Syntax:

<sup> text </sup>
Nach dem Login kopieren
  • Wie in der obigen Syntax gezeigt, ist der Text zwischen dem Das Tag wird als hochgestellter Text für den Text betrachtet. Menschen verwenden es in mathematischen Formeln und spezifischen wissenschaftlichen Gleichungen.
  • Beispiel:

    52 = 25

  • HTML-Sup-Tag unterstützt globale Attribute wie Zugriffsschlüssel, Klasse, Daten-*, Verzeichnis, Inhalt, ziehbar, Dropzone, versteckt, ID, Sprache, Rechtschreibprüfung, Stil, Tabindex, Titel, Übersetzung usw.
  • Es unterstützt auch Ereignisattribute wie onafterprint, onbeforeprint, onerror, onbeforeunload, onhashchange, onload, onmessage, ononline, onoffline, onpagehide, onpopstate, onpageshow, onpagehide, onresize, onunload, onstorage und viele mehr.

Beispiele für SUP-Tags in HTML

Sie können das Sup-Tag auch verwenden, um eine stilvolle Wortmarke für Geschäfts- oder Produktzwecke anzuzeigen. Dies ist auch mit CSS möglich; Wir verwenden hier nicht das Sup-Tag. Ein Beispiel hierfür ist wie folgt:

Beispiel #1

Sehen wir uns an, wie mathematische Gleichungen mit dem geschrieben werden können. Etikett. Ein Beispiel enthält verschiedene mathematische Formeln, wie unten gezeigt:

Code:

<!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>
Nach dem Login kopieren

Ausgabe:

SUP-Tag in HTML

Beispiel #2

Zeigt Quadrate und Kubikzahlen der Zahlen in Tag.

Code:

<!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>
Nach dem Login kopieren

Ausgabe:

SUP-Tag in HTML

Beispiel #3

Tag wird verwendet, um physikalische Gleichungen darzustellen, wie unten gezeigt.

Code:

<!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>
Nach dem Login kopieren

Ausgabe:

SUP-Tag in HTML

Fazit

Hier haben wir erfahren, dass das Das Tag im HTML-Code stellt den Überschriftstext im zugehörigen HTML-Dokument dar. Benutzer verwenden dieses Tag hauptsächlich für mathematische Ausdrücke, wissenschaftliche Gleichungen und die Anzeige von Sprachabkürzungen. Es bietet Text in der Hälfte der unterdurchschnittlichen Zeile und ist in einer kleineren Textgröße.

Das obige ist der detaillierte Inhalt vonSUP-Tag in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage