Heim  >  Artikel  >  Web-Frontend  >  Welche Beziehung besteht zwischen der schwebenden Div-Ebene und der Standard-Div-Ebene?

Welche Beziehung besteht zwischen der schwebenden Div-Ebene und der Standard-Div-Ebene?

php中世界最好的语言
php中世界最好的语言Original
2017-11-22 17:45:542063Durchsuche

Apropos schwebendZuerst müssen wir ein Konzept verstehen. Warum legen wir den schwebenden Stil fest? Weil ich möchte, dass das DIVObject-Feld links oder rechts angeordnet ist. Auf diese Weise können unsere Webseiten schöner und interaktiver werden. Was ist also der Unterschied zwischen Floating-DIV und Standard-DIV? Werfen wir einen Blick auf

Was ist der Unterschied zwischen Div-Floating-Layer und Div-Layer? Im Allgemeinen werden CSS-Stylesheets zum Hinzufügen von DIV-Tag-Kombinationen zum Layouten von Webseiten verwendet. Die

div-Ebene enthält im Allgemeinen eine div-Floating-Ebene. Die div-Floating-Ebene gibt an, dass das div zum

css-Floating-

-Stil hinzugefügt wird, daher wird sie als div-Floating-Ebene bezeichnet Der Floating-Stil hat keinen Floating-Effekt. Wenn dem Div also kein Floating-Stil hinzugefügt wird, wird er nicht als Floating-Ebene bezeichnet. Natürlich sind auch Tags wie span, h1, ul und li Ebenen, aber Tags wie span, h1, ul und li werden nicht so häufig verwendet wie div, daher wird div im Allgemeinen als symbolischer Name verwendet. Als nächstes möchte ich Ihnen erklären, was eine normale Ebene und was eine schwebende Ebene ist. Warum Div-CSS-Floating-Layer verwenden?

Der vollständige DIV+CSS-Beispiel-HTML-Code lautet wie folgt

Das Objekt „.div“ ist nicht auf Float eingestellt, „.div-a“ ist auf Float eingestellt left (float:left), ". "div-b" ist so eingestellt, dass es nach rechts schwimmt (float:right).
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>div层与浮动层</title> 
<style> 
.div{ width:400px; height:100px} 
.div-a{ float:left; border:1px solid #F00; width:100px; height:80px} 
.div-b{ float:right; border:1px solid #00F; width:100px; height:80px} 
</style> 
</head> 
<body> 
<div class="div"> 
<div class="div-a"></div> 
<div class="div-b"></div> 
</div> 
</body> 
</html>

Zusammenfassung der Ebenen und schwebenden Ebenen


Im obigen Beispiel ist das „.div“-Objekt eine normale Ebene und die Standardeinstellung ist eine Ebene ohne schwebenden Effekt, da es sich um eine Webseite handelt Der Inhalt befindet sich auf der linken Seite. Sie können sehen, dass es sich bei dieser Ebene um eine DIV-Box-Ebene ohne schwebenden Stil handelt. Die untergeordneten Elemente „.div-a“ und „.div-b“ innerhalb des Objekts sind so eingestellt, dass sie schweben, sodass sie zu schwebenden Ebenen werden. Wie oben zu sehen ist, schwebt eines nach links und das andere nach rechts das Feld „.div“. Der Unterschied zwischen einer normalen Ebene und einer schwebenden Ebene besteht darin, ob der CSS-Float-Stil festgelegt ist.

Die Unterschiede beim Floating wurden Ihnen sehr deutlich vorgestellt. Weitere spannende Informationen finden Sie auf der chinesischen PHP-Website

Andere

verwandte Artikel! Verwandte Lektüre:

So verwenden Sie den Span-Tag in HTML

So verwenden Sie den 4750256ae76b6b9d804861d8f69e79d3 >

Stileinstellung der HTML-Bildlaufleiste

Das obige ist der detaillierte Inhalt vonWelche Beziehung besteht zwischen der schwebenden Div-Ebene und der Standard-Div-Ebene?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn