Was sind die festen Positionierungs-Tags?

Zu den festen Positionierungs-Tags gehören div, header, footer, nav, aside, Figure, figcaption usw. Detaillierte Einführung: 1. div ist ein allgemeines Element auf Blockebene, das normalerweise zum Erstellen von Seitenlayouts verwendet wird. Durch Festlegen des Positionsattributs kann das Element eine feste Positionierung haben. 2. Header ist normalerweise ein semantisches Element auf Blockebene Wird verwendet, um die Titel- oder Kopfzeileninformationen der Seite darzustellen, indem das Positionsattribut auf „Fest“ usw. gesetzt wird.

Das Betriebssystem dieses Tutorials: Windows 10-System, DELL G3-Computer.

Feste Positionierung ist eine CSS-Positionierungsstrategie, bei der die Position eines Elements relativ zum Browserfenster festgelegt ist und es immer an derselben Position bleibt, auch wenn die Seite gescrollt wird. Diese Art der Positionierung wird häufig für Elemente verwendet, die immer auf der Seite angezeigt werden müssen, wie z. B. Navigationsleisten, Menüs usw. Im Folgenden sind einige Tags aufgeführt, die eine feste Positionierung verwenden:

1. div: div ist ein allgemeines Element auf Blockebene, das normalerweise zum Erstellen von Seitenlayouts verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<div style="position: fixed; top: 0; right: 0;">  
    这是一个固定定位的 div 元素  
</div>

2. Header: Header ist ein semantisches Element auf Blockebene, das normalerweise zur Darstellung der Titel- oder Headerinformationen der Seite verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<header style="position: fixed; top: 0; width: 100%;">  
    这是一个固定定位的 header 元素  
</header>

3. Fußzeile: Die Fußzeile ist ein semantisches Element auf Blockebene, das normalerweise zur Darstellung der unteren Informationen der Seite verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<footer style="position: fixed; bottom: 0; width: 100%;">  
    这是一个固定定位的 footer 元素  
</footer>

4. nav ist ein semantisches Element auf Blockebene, das normalerweise zur Darstellung des Navigationsmenüs der Seite verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<nav style="position: fixed; top: 0; width: 100%;">  
    这是一个固定定位的 nav 元素  
</nav>

5. Beiseite ist ein semantisches Element auf Blockebene, das normalerweise zur Darstellung der Seitenleiste oder der Seitenleisteninformationen der Seite verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<aside style="position: fixed; bottom: 0; width: 100%;">  
    这是一个固定定位的 aside 元素  
</aside>

6. Abbildung: Abbildung ist ein semantisches Element auf Blockebene, das normalerweise zur Darstellung von Illustrationen oder Bildern auf der Seite verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen.

<figure style="position: fixed; top: 0; right: 0;">  
    这是一个固定定位的 figure 元素  
</figure>

7. figcaption: figcaption ist ein semantisches Inline-Element, das normalerweise zur Darstellung des Titels oder der Beschreibung eines Bildes oder einer Illustration verwendet wird. Sie können einem Element eine feste Positionierung zuweisen, indem Sie seine Positionseigenschaft auf „Fixed“ setzen. Beachten Sie jedoch, dass Sie, da es sich bei figcaption um ein Inline-Element handelt, möglicherweise andere Elemente auf Blockebene (z. B. divs) verwenden müssen, um seine Wirkung zu simulieren.

Zusätzlich zu den oben genannten Tags können Sie auch andere Tags (wie span, p usw.) in Verbindung mit dem CSS-Attribut position: Fixed verwenden, um eine feste Positionierung zu erreichen. Es ist jedoch wichtig zu beachten, dass fest positionierte Elemente vom regulären Dokumentenfluss nicht betroffen sind und daher zu einer erhöhten Komplexität des Seitenlayouts führen können. Daher müssen die Auswirkungen und Auswirkungen auf das Layout sorgfältig abgewogen werden, wenn eine feste Positionierung verwendet wird.

Das obige ist der detaillierte Inhalt vonWas sind die festen Positionierungs-Tags?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!