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
Empfohlene Plugins und Anwendungsbeispiele für Vue-Unit-Tests
Inhaltsverzeichnis rahmen Erstklassiges Fehlerrep...
Eine kurze Einführung in MySQL InnoDB ReplicaSet
Inhaltsverzeichnis 01 Einführung in InnoDB Replic...
CSS zum Erzielen des klebrigen Effekts von zwei sich kreuzenden Bällen – Beispielcode
Dies ist ein Effekt, der ausschließlich mit CSS e...
Senden Sie das Image über den Container DockerCommit und pushen Sie das Image DockerPush
Nachdem Sie einen Container lokal erstellt haben,...
Beispiel zum Erstellen eines Datenbanknamens mit Sonderzeichen in MySQL
Vorwort In diesem Artikel wird erklärt, wie Sie i...
Detaillierte Erklärung der Vue-Komponenten
<Text> <div id="Wurzel"> &l...
Node.js fügt den aktuellen Kampfdatensatz der MySQL-Datenbank hinzu, löscht ihn, ändert ihn und überprüft ihn
Inhaltsverzeichnis Drei Schritte zum Betrieb der ...
Beheben Sie das Problem, dass beim Herunterfahren von Tomcat mit shutdown.bat auch andere Tomcats heruntergefahren werden.
Die Datei shutdown.bat enthält einen Satz wenn ni...
Analyse der gemeinsamen Indexfunktion von MySQL und Anwendungsbeispiele
Dieser Artikel veranschaulicht anhand von Beispie...
CSS3 ändert den Bildlaufleistenstil des Browsers
Hinweis: Diese Methode ist nur auf WebKit-basiert...
Detaillierte Erklärung des Abstandsproblems zwischen IMG-Tags
Grundlegende Analyse des IMG-Tags: In HTML5 beste...
Verwenden Sie reines CSS, um einen pulsierenden Loader-Effekt-Quellcode zu erstellen
Effektvorschau Klicken Sie rechts auf die Schaltf...
Einführung in die Linux-Dateikomprimierung und -Verpackung
1. Einführung in Komprimierung und Verpackung All...
Detaillierte Erklärung des Lebenszyklus einer Angular-Komponente (I)
Inhaltsverzeichnis Überblick 1. Hook-Aufrufreihen...
Docker verwendet Busybox, um ein Basis-Image zu erstellen
Die erste Zeile eines Docker-Images beginnt mit e...