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
Installations- und Verwendungsschritte für vue-amap
Ich habe zuvor die Verwendung des asynchronen Lad...
Verwenden Sie Docker, um einen Redis-Master-Slave-Replikationscluster zu erstellen
In einem Cluster mit Master-Slave-Replikationsmod...
Detaillierte Erklärung der Standort- und Umschreibenutzung in nginx
1. Zusammenfassung der Standortnutzung Der Stando...
Entwickeln Sie Beispielcode für einen Taschenrechner mit nativem JavaScript
Die Hauptfunktion eines Rechners besteht darin, n...
Eine detaillierte Einführung in die Neugestaltung der Weibo-Komponente auf der Website (Bilder und Text)
Vorne geschrieben Weibo-Komponenten sind Komponen...
So implementieren Sie Docker Registry zum Erstellen eines privaten Image Warehouse
Das Image des Microservice wird zur Speicherung i...
So fügen Sie Nginx zu den Systemdiensten in CentOS7 hinzu
Einführung Nach dem Kompilieren, Installieren und...
Lösen Sie das Problem, dass das Vue-Projekt beim lokalen Start keine Cookies übertragen kann
Lösen Sie das Problem, dass das Vue-Projekt zwar ...
Detaillierte Erläuterung, wie Vue Werte zurückgibt, um Formulare dynamisch zu generieren und Daten zu übermitteln
Inhaltsverzeichnis Die wichtigsten gelösten Probl...
CSS erzielt einen proportionalen Anzeigeeffekt eines Elements mit fester Höhe und Breite
Durch die Verwendung des prozentualen Padding-Top...
Lösen Sie das Problem, dass beim Ausführen von Docker zwei Ports gestartet werden, die unterschiedliche Ports belegen
Problembeschreibung: Nach der Ausführung von dock...
Karusselleffekte mit JavaScript implementieren
In diesem Artikel wird der spezifische Code für J...
Analyse der Vor- und Nachteile von gespeicherten MySQL-Prozeduren
MySQL Version 5.0 begann, gespeicherte Prozeduren...
Eine kurze Diskussion über die Berechnungsmethode von key_len in MySQL erklären
Mit dem MySQL-Befehl „explain“ können Sie die Lei...
Beispiel für die Verwendung eines manipulationssicheren JavaScript-Objekts
Inhaltsverzeichnis Manipulationssicheres Javascri...