Analyse der grundlegenden Verwendung von ul und li
|
Navigation, kleine Datenmenge Tabelle, zentriert <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <Kopf> <title>ul- und li-Anwendung</title> <style type="text/css"> #menu{width:1000px;height:35px;float:right;margin:0px; clear:both; vertical-align: bottom;} #ul li{list-style-type:none; clear:both;width:100px;display:inline; font-size: greater;} #myul li{float:left;width:100px;} </Stil> </Kopf> <Text> <div id="Menü"> <ul-ID="ul"> <li><a title="" href="http://localhost:1435/BookShop/index.aspx">Startseite</a></li> <li><a title="" href="http://localhost:1435/BookShop/hybooks.aspx">Branchenbücher</a></li> <li><a title="" href="http://localhost:1435/BookShop/Clothing.aspx">Kleidungstrends</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Schönheitssalon</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Mama Baby</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Geschenkbücher</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Neuigkeiten</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Benutzerkommentare</a></li> <li><a title="" href="http://localhost:1435/BookShop/">Kontaktieren Sie uns</a></li> </ul> </div> Standardmäßig ist <div> vertikal und hat Punkte <ul> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> </ul> </div> <div> <ul> <li style="list-style-type:none;">Entferne die Punkte</li> <li style="display:inline;">hallo</li> <li>Hallo</li> <li style="display:inline;">hallo</li> </ul> </div> <!--Wenn Sie bei der horizontalen Methode eine Zentrierung wünschen, müssen Sie die Breite festlegen. Diese Breite muss mit der Gesamtlänge des „li“ im Inneren übereinstimmen. --> <div Stil="text-align:center;Hintergrund:#def"> <ul style="width:150px;background:#eee;"> <li style="float:left;">hallo</li> <li style="float:left;">hallo</li> <li style="float:left;">hallo</li> <li style="float:left;">hallo</li> <li style="float:left;">hallo</li> </ul> </div> <!--Das Prinzip der Tabellenerstellung: Die ul-Breite beträgt 300 Pixel, die li-Breite 100 Pixel, dann gibt es drei Spalten--> <div Stil="text-align:center;Hintergrund:#eef"> <ul id="myul" style="width:300px;background:#eee"> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> <li>Hallo</li> </ul> </div> </body> </html> |
<<: Zusammenfassung der Wissenspunkte des Datenbankindex
>>: Einigen Eigenschaften in CSS geht ein "*" oder "_" voraus.
Artikel empfehlen
Detaillierte Erklärung der MySQL-Berechtigungssteuerung
Inhaltsverzeichnis MySQL-Berechtigungskontrolle B...
Lösen Sie das Problem, dass VMware das 64-Bit-Betriebssystem in der Win10-Home-Version nicht installieren kann
Problembeschreibung Wenn VMware Workstation eine ...
Verwenden von Puppeteer zum Implementieren der Screenshot-Funktion für Webseiten unter Linux (CentOS)
Bei der Installation von Puppeteer unter Linux kö...
Detaillierte Erläuterung des CentOS 6.6-Quellcodes und der Installation des MySQL 5.7.18-Tutorials
1. Benutzer und Gruppen hinzufügen 1. MySQL-Benut...
Zusammenfassung zweier Methoden zum Implementieren der Vue-Druckfunktion
Methode 1: Installieren Sie das Plugin über npm 1...
Mehrere Möglichkeiten zum Berechnen des Alters anhand des Geburtstags in MySQL
Ich habe MySQL vorher nicht sehr oft verwendet un...
Implementierung einer MySQL-Sicherungsstrategie (vollständige Sicherung + inkrementelle Sicherung)
Inhaltsverzeichnis Entwurfsszenario Technische Pu...
Detaillierte Erklärung der Befehle zur Berechtigungsverwaltung in Linux (chmod/chown/chgrp/unmask)
Inhaltsverzeichnis chmod Beispiel Besonderes Auge...
Detaillierte Erläuterung der Kommunikation zwischen Angular-Eltern- und -Kindkomponenten
Inhaltsverzeichnis Verwendete APIs Einfaches Beis...
Mysql-Timeline-Daten, um die ersten drei Daten desselben Tages zu erhalten
Erstellen von Tabellendaten CREATE TABLE `praise_...
Beispiel zum Überprüfen der Kapazität einer MySQL-Datenbanktabelle
Dieser Artikel stellt die Befehlsanweisungen zum ...
Implementierung eines CSS-Festlayouts auf beiden Seiten und eines adaptiven Layouts in der Mitte
Analysieren Sie vier gängige Methoden und Prinzip...
So ändern Sie das Kennwort von mysql5.7.20 unter Linux CentOS 7.4
Nach dem Upgrade von MySQL auf Version 5.7 wurde ...
Eine kurze Einführung in das bionische Design im Internet-Webdesign
Beim Stichwort Bionik-Design denken viele an die E...
So zentrieren Sie den gesamten Seiteninhalt, sodass sich die Höhe an den Inhalt anpasst und automatisch erweitert
So zentrieren Sie den gesamten Seiteninhalt und pa...