Bitte geben Sie mir etwas Platz

Es gibt alle möglichen Möglichkeiten, dies zu tun. Einige ratsamere und besser geeignete für bestimmte Situationen als andere.

Wir könnten es direkt in HTML tun:

 <p> wir gehen aus einer Zeile ... <br> <br> runter ein paar weitere. </p>

Aber dafür ist CSS wirklich:

 <p> wir gehen von einer Zeile ... <spannes> ein paar weitere unten.  </spannes></p>

 Span {
  Anzeige: Block;
  Rand-Block-Start: 1,5Rem;
}

Die Zeilenhöhe kann uns auch einen zusätzlichen Atemraum zwischen Textlinien geben:

 P {
  Linienhöhe: 1,35;
}

Da wir über Text sprechen, gibt es auch Buchstaben- und Wortabstand, ganz zu schweigen von Textindent:

Aber lassen Sie uns anstelle von Text über Boxen sprechen. Sagen Sie, wir haben zwei einfache Divs:

 <div> twiddle dee </div>
<div> twiddle dum </div>

Das sind Blockebene, also sind sie bereits in verschiedenen Zeilen. Wir können wieder nach Rand greifen. Oder wir könnten den Eindruck von Raum mit Polsterung erwecken. Ich nehme an, wir könnten diese Trottel in beide Richtungen übersetzen:

 div: n-Kind (2) {
  Transformation: Translatey (100px);
}

Aber vielleicht sind diese Elemente absolut positioniert, damit wir physische Offsets verwenden können:

 div {
  Position: absolut;
}
div: n-Kind (1) {
  Einschub: 0;
}
div: n-Kind (2) {
  Einschub-Inline-Start: 100px; /* oder oben: 100px; */
}

Wenn wir in einem Gitterbehälter arbeiten, erhalten wir Gap-Age:

 <abschnitt>
  <div> twiddle dee </div>
  <div> twiddle dum </div>
</abschnitt>

 Abschnitt {
  Anzeige: Grid;
  Grid-Template-Säulen: 1fr 1fr;
  Lücke: 100px;
}

Gleicher Deal mit einem flexiblen Behälter:

 Abschnitt {
  Anzeige: Flex;
  Lücke: 100px;
}

Während wir in Gitter und flexiblen Behältern arbeiten, konnten wir jede Ausrichtungseigenschaft aufrufen, um Platz zu generieren.

 Abschnitt {
  Anzeige: Flex;
  Ausrichtung: Weltraum zwischen;
  Rechtfertigungsbekämpfung: Weltraum zwischen;
}

Natürlich gibt es Tische:

twiddle dee

Twiddle Dum

Oder der CSS-y-Ansatz:

 /* Wir könnten "Anzeige: Tabelle" verwenden, wenn wir nicht in einem Tabellenelement arbeiten. */
Tisch {
  Randabstand: 100px;
}

Gehen wir tiefer in das linke Feld. Wir können ein Element wie zwei mit einem linearen Gradienten mit einem harten Farbstopp aussehen lassen:

 div {
  Hintergrundbild:
    linearer Gradient (
      rechts,
      RGB (255 105 0/1) 50%,
      RGB (207 46 46 /1) 50%,
      RGB (207 46 46 /1) 100%
    );
}

Dann machen wir einen Kopf falsch und setzen einen harten transparenten Farbstopp zwischen den beiden Farben ein:

Solange wir hier Speck fördern, könnte es genauso gut den alten „transparenten“ Grenztrick einwerfen:

Gehen wir für einen Moment zurück zum Text. Vielleicht schweben wir ein Element und möchten, dass Text sich um ihn wickelt… in Form des schwebenden Elements, während sie etwas Platz zwischen den beiden hinterlassen. Dafür haben wir Form-Margin:

Wagen Sie es sogar, die Tage von Spacer.gif zu erwähnen?

 <div> twiddle dee </div>
<img  src="Spacer.gif" alt="Bitte geben Sie mir etwas Platz" > 
<div> twiddle dum </div>

Es muss mehr geben

Sie sind alle ein kluger Haufen mit tollen Ideen. Habe es!

Das obige ist der detaillierte Inhalt vonBitte geben Sie mir etwas Platz. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!