HTML-Selbststudium (I) Grundlegende Elemente und Attribute üben (Schreiben Sie Ihren eigenen Code)
|
Ich habe das Tutorial auf W3school durchgearbeitet. Ich finde das Tutorial sehr gut. In jedem Abschnitt gibt es kleine Übungen. Komm schon! Alle Codes habe ich selbst geschrieben. Einige Bücher sprechen sich dagegen aus, Code selbst zu schreiben, aber ich denke, es ist von Vorteil, ihn selbst zu schreiben, da ich keine Grundkenntnisse habe. Hehe, persönliche Meinungen gehen auseinander. . Übung 1 : Code kopieren Der Code lautet wie folgt:<html> <body bgcolor="gelb"> <h1 align="center">Dies ist Überschrift 1</h1> <h2 align = "left">Dies ist Überschrift 1</h2> <h3 align = "right">Dies ist Überschrift 1</h3> <h4>Dies ist Überschrift 1</h4> <h5>Dies ist Überschrift 1</h5> <h6>Dies ist Überschrift 1</h6> <!--<h7>Dies ist Überschrift 1</h7>--> <!--Noch ein Kommentar, probieren Sie den Effekt aus--> <p>Dies ist der erste Absatz </p> <hr />Dies ist der Linkbereich <a href="http://www.baidu.com">Dies ist ein Baidu-Link</a> <br/> <a href="http://www.w3school.com.cn">Dies ist der w3school-Link</a> <hr />Dies ist der Bildbereich <img src = "upload/2022/web/96x96_1758293e995c.jpg" /> <hr />Dies ist der Tabellenbereich <Tabellengrenze="1"> <tr> <th>Monat</th> <th>Ersparnisse</th> </tr> <tr> <td>Januar</td> <td>100 US-Dollar</td> </tr> </Tabelle> <hr />Zeilenumbruchfunktion <p>Dieser Satz endet hier </p> <p> Dieser Absatz enthält viele Leerzeilen oder Leerzeichen, aber der Browser ignoriert sie automatisch </p> <vor> Dies ist vorformatierter Text, der Leerzeilen, Leerzeichen und Code anzeigen kann </pre> <vor> während(wahr) { Summe=a+b; Rücklaufsumme; cout<<Summe; } </pre> </body> </html> Übung 2 : Code kopieren Der Code lautet wie folgt:<html> <Text> <b>Dieser Text ist fett</b> <strong>Dieser Text ist stark</strong> <big>Dieser Text ist groß</big> <small>Dieser Text ist klein</small> <em>Dieser Text ist hervorgehoben</em> <i>Dieser Text ist kursiv</i> Dieser Text enthält <sub>Tiefgestellt</sub> Dieser Text enthält<sup>hochgestellte</sup> <hr /> <vor> Dies ist vorformatierter Text. Haha, Leerzeichen und Leerzeilen kann man doch ausgeben, oder? </pre> <Code> während(wahr) { Computercode; } </code> <kbd>Tastatureingabe</kbd> <samp>Beispieltext</samp> <var>Computervariable</var> <hr /> Adressübung: <Adresse> Tianjin SHUDIP FERT R ABC (Sammlung) Postleitzahl: 123456 </Adresse> Abkürzungspraxis <abbr Titel = "usw.">usw.</abbr> <acronym title = "World Wide Web">www.</acronym> <hr />Übung zur Textrichtung // Diese Funktion wird nicht unterstützt. Der Text soll von rechts nach links ausgegeben werden. <bdo dir="rt1">Hier ist etwas Text</bdo> <hr />Blockreferenzübung Dies ist ein langes Zitat <blockquote>Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat.</blockquote> Dies ist ein kurzes Zitat <q>Kurzes Zitat, wow, kurzes Zitat</q> <hr />Üben Sie das Löschen oder Hinzufügen von Texteffekten <p>Es gibt <del>zwanzig</del><ins>zwölf</ins> in einem Dutzend</p> </body> </html> Es muss super einfach sein, hehe, mach einfach weiter! |
<<: CSS realisiert den Maskeneffekt, wenn die Maus über das Bild bewegt wird
>>: So reduzieren Sie die Speicher- und CPU-Auslastung von Webseiten
Artikel empfehlen
Installationsschritte für die chinesische Eingabemethode von Ubuntu 20.04
Dieser Artikel installiert die Google-Eingabemeth...
Eine Methode zum Erstellen von Karussellbildern mit CSS3
Diashows sieht man häufig auf Webseiten. Sie enth...
Analyse des Konfigurationsprozesses zur Installation von MariaDB basierend auf Docker
1. Installation Suchen Sie über DockerHub nach de...
JavaScript zum Erreichen eines dynamischen Farbwechsels der Tabelle
In diesem Artikel wird der spezifische Code für J...
Detailliertes Beispiel für das Datenbankbetriebsobjektmodell in Spring jdbc
Detailliertes Beispiel für das Datenbankbetriebso...
CSS-Beispielcode zum Erzielen eines kreisförmigen Fortschrittsbalkeneffekts mit Farbverlauf
Umsetzungsideen Ganz außen ist ein großer Kreis (...
Detaillierte Erläuterung verschiedener Methoden der Vue-Komponentenkommunikation
Inhaltsverzeichnis 1. Vom Vater zum Sohn 2. Vom S...
Eine kurze Diskussion über den Aufbau und den Betriebsmechanismus des Echtzeit-Computerframeworks Flink Cluster
Inhaltsverzeichnis 1. Flink-Übersicht 1.1 Grundle...
Analyse der Verschachtelungsregeln von XHTML-Tags
In der XHTML-Sprache wissen wir alle, dass das ul...
Docker erstellt CMS-On-Demand-System mit Player-Funktion
Inhaltsverzeichnis Text 1. Maschine vorbereiten 2...
Verwenden von Textschatten- und Elementschatteneffekten in CSS
Einführung in Textschatten Verwenden Sie in CSS d...
Sechs Möglichkeiten zur Steigerung der Geschwindigkeit Ihrer Website
1. Ersetzen Sie die Adresse Ihrer .js-Bibliotheks...
Vue3 AST Parser-Quellcode-Analyse
Inhaltsverzeichnis 1. Generieren Sie einen abstra...
Zusammenfassung verschiedener Replikationsmethoden für die MySQL Master-Slave-Replikation
Asynchrone Replikation Die MySQL-Replikation erfo...