Wie man gepunktete Grenzen in HTML setzt

Autor：Eve Cole Aktualisierungszeit：2025-05-15 03:16:01

Verwenden Sie CSS -Stile und HTML -Tagelemente

Um den verschiedenen HTML -Tags von Rand gepunktete Linien hinzuzufügen, wählen wir mehrere übliche Etikettenausrichtungen aus, um den Grenz -gepunkteten Linieneffekt festzulegen.

1. gemeinsame HTML -Tags

P -Tag

Spanne

ul li

Tabelle Tr td

2. CSS -Attributwörter werden im Beispiel verwendet

Grenze

Breite

Höhe

3. Einführung in die wichtigsten Punkte der Implementierung gepunktete Linien

Grenze ist ein Grenzmerkmal. Wenn Sie den Grenzeffekt eines Objekts erreichen möchten, müssen Sie die Randbreite, die Grenzfarbe und den Randstil festlegen (feste oder gepunktete Linien)

Grenze: 1PX gestrichelt #f00 Dies soll die Randstilbreite auf 1PX, die gepunktete Linie und die gepunktete Linie auf Rot setzen.

4. Beispiel Beschreibung

Wir setzen die gleichen Breite, gleiche Höhe und Randeffekte für die oben genannten Etiketten.

5. Komplett HTML -Code:

 <! DocTypEHTML> <html>
 <Head> <metacharset = utf-8/>
 <title> HTML Border Dotted Line Demonstration www.pcss5.com </title> <style>
 .bor {Border: 1pxdashed#f00; Breite: 300px; Höhe: 60px; Margin-Top: 10px} Span {Anzeige: Block}/*CSS Kommentar Beschreibung: Lassen
 </style> </head>
 <body> <pclass = bor> pBox </p>
 <spanclass = bor> span box </span> <ulclass = bor>
 <li> Ulli -Liste </li> <li> Ulli -Liste </li>
 </ul> <tableClass = bor>
 <tr> <td> Form </td>
 <td> Tabelle 2 </td> </tr>
 <tr> <td> Daten </td>
 <td> Data 2 </td> </tr>
 </table> </body>
 </html>

Das obige Beispiel legt den gleichen Stil für verschiedene Tags in HTML fest, einschließlich der gleichen randspizierten Linien.

6. Browsereffekt Screenshot

Screenshot des gepunkteten Effekts verschiedener Tags in HTML -Setgrenzen und gepunkteten Linien