Wat is pre in CSS-stijl? De rol van pre-wrapping codetags in HTML

Om een ​​website met WordPress te bouwen, moeten we eerst wat basiskennis van CSS en HTML opdoen:

• Vanwege de CSS-stijlbestanden van sommige WordPress-thema's worden de pre- en codetagstijlen niet toegevoegd.
• De meeste browsers ondersteunen momenteelmarkering.

HTML  Labelvoorbeeld

Het volgende is de CSS-stijl van de pre-tag (die de html-code automatisch kan omhullen) ▼

pre {
border: 1px solid #d1d1d1;
line-height: 190%;
margin: 0 0 1.75em;
max-width: 100%;
overflow: auto;
padding: 15px;
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}

Het volgende is de CSS-stijl van de codetag ▼

code {
background: #f1f1f1;
color: #555;
margin: 0 2px;
padding: 2px 4px;
border-radius: 2px;
}

Hoe te gebruiken:

• Kopieer de bovenstaande CSS-tags naar het WordPress-thema style.css in het bestand.

HTML pre-tag functie en gebruiksinstructies

• Labels definiëren vooraf opgemaakte tekst.
• In opmaakelementen laat de ingesloten tekst meestal spaties en regeleinden achter.
• De tekst wordt ook weergegeven in monospaced lettertype.

Markup wordt vaak标记结合使用，以获得更精确的语义，用于标记需要在页面中呈现的源代码。

Als u het opgegeven tekstformaat in HTML wilt plaatsen, moet u profiteren van het kenmerk van het leidende element.

Tips en instructies:

hint:Een veelgebruikt gebruik van tags is om de broncode van een computer weer te geven.

Verschillen tussen HTML 4.01 en HTML5

In HTML 4.01 is het attribuut "width" verouderd en kan niet worden gebruikt. HTML5 ondersteunt het kenmerk "width" niet.

attribuut

Beschrijving van eigendomswaarde

• Breedtenummer HTML5 ondersteunt dit kenmerk niet.
• Dit kenmerk is verouderd in HTML 4.01.
• Definieert het maximum aantal tekens per regel (meestal 40,80, 132 of XNUMX).

globale eigenschappen

• <pre>Markup ondersteunt globale attributen, en bekijk het volledige eigenschappenblad HTML global attributes.

Evenement eigenschappen

• Tags ondersteunen alle HTML-gebeurteniskenmerken.