Um die Größe von Einzügen in HTML-Seiten festzulegen, werden meistens die Fähigkeiten der CSS-Sprache (Cascading Style Sheets) verwendet. Obwohl es in der HTML-Sprache selbst mehrere "rudimentäre" Überbleibsel gibt, die es in einigen Fällen ermöglichen, Einrückungen zu setzen. Im Folgenden sind die am häufigsten verwendeten Optionen aufgeführt, aber daneben gibt es noch viele verschiedene Arten von Tricks, mit denen Sie Einzüge für nicht standardmäßige Markups von HTML-Dokumenten festlegen können.
Es ist notwendig
Grundkenntnisse in HTML- und CSS-Sprachen
Anleitung
Schritt 1
Bestimmen Sie das Seitenelement, von dem aus eingerückt werden soll. Wenn der Text beispielsweise innerhalb des Tags … (Block) platziert wird, ist dieser Block das übergeordnete Element für diesen Text und der Einzug sollte von den Rändern des Blocks aus gezählt werden. Und wenn sich der Text (oder das Bild) nicht innerhalb eines Block- (div, li usw.) oder Inline- (span, p usw.) Elements befindet, dann ist sein Elternteil der Dokumentkörper (Body-Tag). Das Definieren eines übergeordneten Elements für den Text ist erforderlich, da er die Beschreibungen der Stile festlegen muss, die die Einzüge bilden. Angenommen, Ihr Text befindet sich in einem div-Block: Beispieltext
Schritt 2
Verwenden Sie die Eigenschaft margin der CSS-Sprache, um Ränder festzulegen, d. h. den Abstand von den Rändern eines Elements zu benachbarten Elementen sowie zu den Rändern des übergeordneten Elements. Dieser Abstand kann für die Polsterung auf jeder Seite separat eingestellt werden: Rand-oben - oben, Rand-rechts - rechts, Rand-unten - unten, Rand-links - links. Für das obige Beispiel könnte dieser CSS-Code so aussehen: div {
Rand oben: 10px;
Rand rechts: 15px;
Rand-unten: 40px;
Rand links: 70px;
} Hier ist "div" ein Selektor, der angibt, dass dieser Stil auf alle divs im Dokumentcode angewendet werden soll. Die CSS-Syntax ermöglicht es Ihnen, alle vier Zeilen zu einer zu kombinieren: div {
Rand: 10px 15px 40px 70px;
} Die Werte der Einzüge müssen immer in dieser Reihenfolge angegeben werden: zuerst - oben, dann - rechts, unten und links. Wenn die Einzüge auf allen Seiten gleich sind, dann reicht es, den Wert anzugeben einmal: div {
Rand: 70px;
} Außerdem können Sie einen schwebenden horizontalen Rand (d. h. links und rechts) festlegen. Dies kann sehr nützlich sein, wenn Sie einen Block einer bestimmten Breite genau in die Mitte des Browserfensters setzen müssen. Der Browser selbst bestimmt automatisch, wie viel Einrückung auf beiden Seiten sein soll, wenn Sie folgendes CSS-Statement schreiben: div {
Rand: 0 automatisch;
}
Schritt 3
Verwenden Sie die Eigenschaft padding, um padding festzulegen, d. h. den Abstand vom Rand eines Elements zu allen darin platzierten Elementen, einschließlich Text. Die Syntax für diese Eigenschaft ist genau dieselbe wie für die Margin-Eigenschaft: div {
Polsterung-Oberseite: 10px;
Polsterung-rechts: 15px;
Polsterung unten: 40px;
Polsterung-links: 70px;
} Oder div {
Füllung: 10px 15px 40px 70px;
}
Schritt 4
Verwenden Sie die Eigenschaft text-indent, um den zusätzlichen Einzug für die erste Zeile jedes Textabsatzes festzulegen. Zum Beispiel: div {
Texteinzug: 80px;
}
Schritt 5
Verwenden Sie die hspace- und vspace-Attribute des HTML-img-Tags, um den horizontalen bzw. vertikalen Einzug vom Bild zu den äußeren Elementen festzulegen. Zum Beispiel so:
Schritt 6
Verwenden Sie das cellpadding-Attribut des Tabellen-Tags, wenn Sie den Einzug von den Rändern der Zellen in der Tabelle auf ihren Inhalt setzen müssen. Und das Cellspacing-Attribut legt den Abstand zwischen den Tabellenzellen fest. Beispielsweise:
| 1 | 2 |
