Heim Web-Frontend CSS-Tutorial Einführung in das Festlegen der Eigenschaften und Stile der DIV-Bildlaufleiste

Einführung in das Festlegen der Eigenschaften und Stile der DIV-Bildlaufleiste

Nov 17, 2017 am 09:43 AM
属性 方式 样式

Die DIV-Bildlaufleiste verwendet das DIV-Tag, um ein CSS-Stylesheet einzubetten. Wenn der Inhalt des durch das div definierten Bereichs eine bestimmte Ebene erreicht, betten Sie das CSS-Stylesheet in das div-Tag ein und definieren Sie den Überlaufattributwert. und legen Sie die Eigenschaften der DIV-Bildlaufleiste fest.

Hier finden Sie eine Beschreibung der Eigenschaften und Stileinstellungen der p-Bildlaufleiste. Die sogenannte p-Bildlaufleiste verwendet das p-Tag, um das CSS-Stylesheet einzubetten und den Überlaufattributwert hinzuzufügen der durch p regulierte Bereich Wenn der Inhalt darin ein bestimmtes Niveau erreicht, ist die Bildlaufleiste praktisch.

Attribute und Stileinstellungen der p-Bildlaufleiste

Die sogenannte p-Bildlaufleiste verwendet das p-Tag, bettet das CSS-Stylesheet darin ein und fügt hinzu der Überlaufattributwert. Auf diese Weise ist die Bildlaufleiste praktisch, wenn der Inhalt in dem durch p regulierten Bereich ein bestimmtes Niveau erreicht. Seine Funktion besteht wahrscheinlich darin, Seitenplatz zu sparen, was das sogenannte „Verkleinern des Platzes“ ist.

Wenn der Inhalt des durch p definierten Bereichs ein bestimmtes Niveau erreicht, betten Sie das CSS-Stylesheet in das p-Tag ein, definieren Sie den Attributwert des Überlaufs und legen Sie die Attribute fest, die sich auf die p-Bildlaufleiste beziehen.

Beispielcode:

<styletylestyletyle="text/css"> 
.testDiv{  
border-style:solid;  
border-width:50px;  
border-color:pink;  
 
position:absolute;  
top:200px;  
left:300px;  
height:200px;  
width:300px;  
 
overFlow-x:scroll;  
overFlow-y:hidden;  
 
scrollBar-face-color:green;  
scrollBar-hightLight-color:red;  
scrollBar-3dLight-color:orange;  
scrollBar-darkshadow-color:blue;  
scrollBar-shadow-color:yellow;  
scrollBar-arrow-color:purple;  
scrollBar-track-color:black;  
scrollBar-base-color:pink;  
 
}  
 
</style>
Nach dem Login kopieren

Hinweis:

1.overFlow:

sichtbar Speichern Wert, es gibt keine p-Bildlaufleiste, die Größe des Unterstützungsbereichs wird automatisch entsprechend dem Inhalt erweitert, dh der definierte Bereich ist ungültig

Scrollen zeigt immer die Bildlaufleiste an

versteckt Es gibt keine Bildlaufleiste und der Inhalt außerhalb des Bereichs ist nicht vorhanden. Es ist ersichtlich, dass

automatisch anhand des Inhalts automatisch bestimmt, ob eine Bildlaufleiste hinzugefügt werden soll

2.p Farbattribut der Bildlaufleiste:

Gesichtsfarbe: Schiebereglerfarbe

Hightlight-Farbe: Hervorhebungsfarbe

3dlight-Farbe: dreidimensionale Lichtfarbe

darkshadow-color: Schattenfarbe

shadow-color: Schattenfarbe

arrow-color: Pfeilfarbe

track-color: Slide-Farbe

Grundfarbe: Die Hauptfarbe der p-Bildlaufleiste, die die Bildlaufschaltfläche und den Bildlaufschieberegler enthält

3.overFlow-xoverFlow-y

sichtbarer Speicherwert, hat Keine p-Bildlaufleiste, und die Größe des Bereichs wird automatisch entsprechend dem Inhalt erweitert, d. und Inhalte außerhalb des Bereichs sind unsichtbar

automatisch bestimmt anhand des Inhalts automatisch, ob Bildlaufleisten hinzugefügt werden sollen


Experten erklären, was p bedeutet?

  1. JavaScript
  2. Dynamische Erstellung von p-Attributen und -Stilen
  3. Der Unterschied zwischen SPAN-Elementen und p-Elementen

  4. Verwendung des Page-Break-After-Attributs in CSS2.0

  5. Untersuchung des Unterschieds zwischen border:none; und border:0 in CSS

  6. Zusammenfassung:

Dieser Artikel beschreibt Ihnen die Eigenschaften und Stileinstellungen der p-Bildlaufleiste Die sogenannte p-Bildlaufleiste verwendet das p-Tag, bettet ein CSS-Stylesheet ein und fügt den Überlaufattributwert hinzu. Wenn der Inhalt in dem durch p regulierten Bereich ein bestimmtes Niveau erreicht, ist die Bildlaufleiste praktisch .


Verwandte Empfehlungen:

Analyse des CSS-Steuerelement-Bildlaufleistenstils

Detailliertes Beispiel für den benutzerdefinierten CSS3-Bildlaufleistenstil

Beispiel für die CSS-Einstellung des Div-Bildlaufleistenstils

Das obige ist der detaillierte Inhalt vonEinführung in das Festlegen der Eigenschaften und Stile der DIV-Bildlaufleiste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

macOS: So ändern Sie die Farbe von Desktop-Widgets macOS: So ändern Sie die Farbe von Desktop-Widgets Oct 07, 2023 am 08:17 AM

In macOS Sonoma müssen Widgets nicht wie in früheren Versionen von Apples macOS außerhalb des Bildschirms ausgeblendet oder im Benachrichtigungscenter vergessen werden. Stattdessen können sie direkt auf dem Desktop Ihres Mac platziert werden – sie sind auch interaktiv. Bei Nichtgebrauch verschwinden macOS-Desktop-Widgets in einem monochromen Stil im Hintergrund, wodurch Ablenkungen reduziert werden und Sie sich auf die aktuelle Aufgabe in der aktiven Anwendung oder im aktiven Fenster konzentrieren können. Wenn Sie jedoch auf den Desktop klicken, kehren sie zur Vollfarbe zurück. Wenn Sie ein tristes Aussehen bevorzugen und diesen Aspekt der Einheitlichkeit auf Ihrem Desktop beibehalten möchten, gibt es eine Möglichkeit, es dauerhaft zu machen. Die folgenden Schritte zeigen, wie es gemacht wird. Öffnen Sie die Systemeinstellungen-App

Pythons dir()-Funktion: Zeigen Sie die Eigenschaften und Methoden eines Objekts an Pythons dir()-Funktion: Zeigen Sie die Eigenschaften und Methoden eines Objekts an Nov 18, 2023 pm 01:45 PM

Dir()-Funktion von Python: Eigenschaften und Methoden eines Objekts anzeigen, spezifisches Codebeispiel erforderlich Zusammenfassung: Python ist eine leistungsstarke und flexible Programmiersprache und ihre integrierten Funktionen und Tools bieten Entwicklern viele praktische Funktionen. Eine der sehr nützlichen Funktionen ist die Funktion dir(), die es uns ermöglicht, die Eigenschaften und Methoden eines Objekts anzuzeigen. In diesem Artikel wird die Verwendung der Funktion dir() vorgestellt und ihre Funktionen und Verwendungen anhand spezifischer Codebeispiele demonstriert. Text: Die dir()-Funktion von Python ist eine integrierte Funktion.

Leitfaden zum Beheben von Fehlausrichtungen von WordPress-Webseiten Leitfaden zum Beheben von Fehlausrichtungen von WordPress-Webseiten Mar 05, 2024 pm 01:12 PM

Leitfaden zum Beheben falsch ausgerichteter WordPress-Webseiten. Bei der Entwicklung von WordPress-Websites stoßen wir manchmal auf falsch ausgerichtete Webseitenelemente. Dies kann an Bildschirmgrößen auf verschiedenen Geräten, Browserkompatibilität oder falschen CSS-Stileinstellungen liegen. Um diese Fehlausrichtung zu beheben, müssen wir das Problem sorgfältig analysieren, mögliche Ursachen finden und es Schritt für Schritt debuggen und reparieren. In diesem Artikel werden einige häufig auftretende Probleme mit der Fehlausrichtung von WordPress-Webseiten sowie entsprechende Lösungen vorgestellt und spezifische Codebeispiele bereitgestellt, die bei der Entwicklung helfen

CSS-Webhintergrundbilddesign: Erstellen Sie verschiedene Hintergrundbildstile und -effekte CSS-Webhintergrundbilddesign: Erstellen Sie verschiedene Hintergrundbildstile und -effekte Nov 18, 2023 am 08:38 AM

CSS-Webseiten-Hintergrundbilddesign: Erstellen Sie verschiedene Hintergrundbildstile und -effekte. Es sind spezifische Codebeispiele erforderlich. Zusammenfassung: Im Webdesign sind Hintergrundbilder ein wichtiges visuelles Element, das die Attraktivität und Lesbarkeit der Seite effektiv verbessern kann. In diesem Artikel werden einige gängige Designstile und -effekte für CSS-Hintergrundbilder vorgestellt und entsprechende Codebeispiele bereitgestellt. Leser können diese Hintergrundbildstile und -effekte entsprechend ihren eigenen Bedürfnissen und Vorlieben auswählen und anwenden, um bessere visuelle Effekte und ein besseres Benutzererlebnis zu erzielen. Schlüsselwörter: CSS, Hintergrundbild, Designstil, Effekt, Codedarstellung

Bottom-Attributsyntax in CSS Bottom-Attributsyntax in CSS Feb 21, 2024 pm 03:30 PM

Syntax und Codebeispiele für das Bottom-Attribut in CSS In CSS wird das Bottom-Attribut verwendet, um den Abstand zwischen einem Element und dem Boden des Containers anzugeben. Es steuert die Position eines Elements relativ zum unteren Rand seines übergeordneten Elements. Die Syntax des unteren Attributs lautet wie folgt: element{bottom:value;} wobei element das Element darstellt, auf das der Stil angewendet werden soll, und value den festzulegenden unteren Wert darstellt. Der Wert kann ein bestimmter Längenwert sein, z. B. Pixel

Einführung in die Eigenschaften von Hearthstones Despair Thread Einführung in die Eigenschaften von Hearthstones Despair Thread Mar 20, 2024 pm 10:36 PM

Thread of Despair ist eine seltene Karte in Blizzard Entertainments Meisterwerk „Hearthstone“ und kann im Kartenpaket „Wizbane's Workshop“ erhalten werden. Kann 100/400 arkane Staubpunkte verbrauchen, um die Normal-/Goldversion zu synthetisieren. Einführung in die Eigenschaften von Hearthstones Faden der Verzweiflung: Er kann mit einer Chance in Wizbanes Werkstattkartenpaket erhalten oder auch durch arkanen Staub synthetisiert werden. Seltenheit: Selten Typ: Zauber Klasse: Todesritter Mana: 1 Wirkung: Verleiht allen Dienern ein Todesröcheln: Fügt allen Dienern 1 Schaden zu

Welche Rolle spielt das pageXOffset-Attribut in JavaScript? Welche Rolle spielt das pageXOffset-Attribut in JavaScript? Sep 16, 2023 am 09:17 AM

Wenn Sie die Pixel ermitteln möchten, um die das Dokument von der oberen linken Ecke des Fensters gescrollt wird, verwenden Sie die Eigenschaften pageXoffset und pageYoffset. Verwenden Sie pageXoffset für horizontale Pixel. Beispiel Sie können versuchen, den folgenden Code auszuführen, um zu lernen, wie Sie das pageXOffset-Attribut in JavaScript verwenden – Live-Demonstration <!DOCTYPEhtml><html> <head> <style> &amp

Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Feb 29, 2024 am 09:03 AM

Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wenn Sie jQuery zum Betreiben von DOM-Elementen verwenden, stoßen Sie häufig auf Situationen, in denen Sie feststellen müssen, ob ein Element ein bestimmtes Attribut hat. In diesem Fall können wir diese Funktion einfach mit Hilfe der von jQuery bereitgestellten Methoden implementieren. Im Folgenden werden zwei häufig verwendete Methoden vorgestellt, um festzustellen, ob ein jQuery-Element über bestimmte Attribute verfügt, und um spezifische Codebeispiele anzuhängen. Methode 1: Verwenden Sie die Methode attr() und den Operator typeof //, um zu bestimmen, ob das Element ein bestimmtes Attribut hat

See all articles