HTML ungeordnete Liste Aufzählungspunkte mit Bildern CSS schreiben
|
Erstellen Sie eine HTML-Seite mit einer ungeordneten Liste von mindestens fünf Bestsellern. Der Aufzählungspunkt vor jedem Buch muss eine Miniaturansicht sein, die das Cover zusammenfasst. Diese Informationen können im Internet abgerufen werden. Erfordert CSS-Ansatz für das Layout. HTML: Code kopieren Der Code lautet wie folgt:<html> <Kopf> <meta http-equiv="Inhaltstyp" content="text/html; charset=gb2312" /> <link href="buch.css" rel="stylesheet" type="text/css"> </Kopf> <!--.author:svitter;--> <Text> <div> <h1 class="diffentcolor">Linux-Bestseller</h1> <div id="Menü"> </div> <div id="Inhalt"> <ul> <li id="book1">Bird Brothers private Linux-Rezept-Grundlagen</li> <li id="book2">Bird Brothers Linux Private Kitchen Server Edition</li> <li id="book3">Linux-Befehlszeilen- und Shell-Skript-Programmier-Enzyklopädie</li> <li id="book4">Linux-Betrieb und -Wartung</li> <li id="book5">Linux/Unix-System-Programmierhandbuch</li> </ul> </div> </div> </body> buch.css: Code kopieren Der Code lautet wie folgt:.unterschiedlicheFarbe{Farbe:grün;} #differcolor{Farbe:grün} Körper, td, div, .p, ein { Schriftfamilie: Arial, Sans-Serif; } h1,h2{ Schriftfamilie: serifenlos; Farbe: grau; } .Autor{ von:svitter; } h1{ Rahmen unten: 1px, durchgehend schwarz; Rahmen unten: 1px; tiefschwarz; } div#container{width:500p} div#Menü {Breite:150px;Float:links;} div#Inhalt {float:left;} li#buch1{ Listenstil-Bild: URL (Bild/popularBook.jpg); } li#buch2{ Listenstil-Bild: URL (Bild/popularBook2.jpg); } li#buch3{ Listenstil-Bild: URL (Bild/popularBook3.jpg); } li#book4{ Listenstil-Bild: URL (Bild/popularBook4.jpg); } li#book5{ Listenstil-Bild: URL (Bild/popularBook5.jpg); } |
<<: idea verwendet Docker-Plugin, um automatisierte Bereitstellung mit einem Klick zu erreichen
>>: JS praktisches objektorientiertes Schlangenspielbeispiel
Artikel empfehlen
Detaillierte Erklärung der Verwendung von Bildschirmbefehlen in Linux
GUN-Bildschirm: Offizielle Website: http://www.gn...
Eingabedatei zur benutzerdefinierten Schaltflächenverschönerung (Demo)
Ich habe schon einmal einen solchen Artikel gesch...
So greifen Sie über die IP-Adresse auf MySql zu
1. Melden Sie sich bei MySQL an: mysql -u root -h...
JavaScript-Grundlagenvariablen
Inhaltsverzeichnis 1. Variablenübersicht 1.1 Spei...
Optimieren Sie die Speichereffizienz von BLOB- und TEXT-Spalten in InnoDB-Tabellen
Lassen Sie uns zunächst einige wichtige Punkte zu...
Nach dem Neustart des Baota-Panels wird die Meldung -ModuleNotFoundError: Kein Modul mit dem Namen „geventwebsocket“ angezeigt.
Hintergrund: Da der Server das Flask-Projekt bere...
JavaScript zum Hinzufügen und Löschen von Nachrichten im Message Board
Dieser Artikel zeigt ein kleines Beispiel für das...
Detaillierte Erklärung zur grundlegenden Verwendung des React Native-Scaffoldings
Erstellen des Projekts Führen Sie die Befehlszeil...
Zusammenfassung gängiger Nginx-Techniken und Beispiele
1. Priorität mehrerer Server Wenn beispielsweise ...
Vue implementiert horizontales Scrollen von Text im Laufschriftstil
In diesem Artikel wird der spezifische Code für V...
Beispiel zum schnellen Löschen einer 2T-Tabelle in MySQL in Innodb
Vorwort Dieser Artikel stellt hauptsächlich den r...
Docker-Installations- und Konfigurationsschritte für MySQL
Inhaltsverzeichnis Vorwort Umfeld Installieren Er...
So zeigen Sie Bildinformationen in Docker an
In diesem Artikel müssen wir lernen, wie man Bild...
MySQL 8.0.11 Installationstutorial mit Bildern und Text
Es gibt viele Tutorials im Internet und sie sind ...
Codebeispiele für den Import und Export von Docker-Images
Import und Export von Docker-Images Dieser Artike...