Heim Web-Frontend HTML-Tutorial So legen Sie die Bildlaufleiste in DIV fest

So legen Sie die Bildlaufleiste in DIV fest

Nov 20, 2017 pm 12:24 PM
怎么 滚动 设置

Im tatsächlichen Betriebsprozess wissen wir, dass viele DIVs nicht ausreichen, um den gesamten Inhalt anzuzeigen. Daher werde ich Ihnen heute beibringen, wie Sie die Bildlaufleiste von DIV festlegen.

Legen Sie Bildlaufleisten für das Div fest und legen Sie dessen horizontale und vertikale Bildlaufleistenstile fest. Die erforderlichen CSS-Stile sind overflow-y und overflow-x, um die Effekte der rechten und unteren Bildlaufleiste des Div-Box-Objekts festzulegen. Gleichzeitig können Sie auch CSS-Stile verwenden, um die Bildlaufleiste des HTML-Frame-Iframes auszublenden. Ich werde es Ihnen als Nächstes vorstellen.

1. Grundlegendes Verständnis von CSS – TOP


overflow-y:scroll; Zeigt immer die vertikale Bildlaufleiste an

overflow-y : sichtbar: Schneiden Sie den Inhalt nicht ab und fügen Sie keine vertikale Bildlaufleiste hinzu

Verstehen Sie: Overflow-y-Handbuch http://www.divcss5.com/shouce/c_overflowy.shtml

overflow-x :scroll ; Zeigt immer horizontale Bildlaufleisten an

overflow-x:visible: Inhalte nicht ausschneiden und keine horizontalen Bildlaufleisten hinzufügen

Weitere Informationen: overflow-x-Handbuch http://www.divcss5. com /shouce/c_overflowx.shtml

Erfahren Sie mehr über CSS-Überlauf

2. Beispiel für die div-Einstellung der Bildlaufleiste


DIVCSS5 durch Festlegen des ersten DIV Das Objekt legt die Div-Breite, die Div-Höhe und den Div-Rahmenstil fest und fügt dem DIV-Feld Demonstrationstextinhalte hinzu. Das zweite Feld legt den gleichen CSS-Stil und den gleichen Textinhalt im Feld fest und legt horizontale und vertikale Bildlaufleisten fest um den Effekt zu beobachten.

Das erste Box-CSS heißt „divcs5-a“ und der zweite DIV-Box-Stilselektor heißt „divcss5-b“.

1. Der spezifische vollständige HTML-Quellcode lautet wie folgt:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="gb2312" /> 
<title>div滚动条 在线演示 www.divcss5.com</title> 
<style> 
.divcss5-a,.divcss5-b{ width:150px; height:100px; float:left; border:1px solid #F00} 
.divcss5-b{ margin-left:10px;overflow-y:scroll; overflow-x:scroll;} 
/* css注释说明:设置第二个盒子与第一个盒子间距为10px,并设置了横纵滚动条样式 */ 
</style> 
</head> 
<body> 
<div class="divcss5-a">哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈
哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈
哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊</div> 
 
<div class="divcss5-b">哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈
哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈
哈哈哈哈啊哈哈哈哈哈哈啊哈哈哈哈哈哈啊</div> 
</body> 
</html>
Nach dem Login kopieren

Um den Effekt zu beobachten, legen wir für beide DIV-Boxen den gleichen CSS-Stil und den gleichen Textinhalt fest. Legen Sie fest, dass für das Feld ein Bildlaufleistenstil festgelegt ist, sodass auf der rechten Seite (Y) der vertikalen Richtung kein Überlauf auftritt

So blenden Sie die CSS-Div-Bildlaufleiste aus

DIV verfügt standardmäßig nicht über Bildlaufleisten. Wenn ein Bildlaufleistenstil hinzugefügt wird, verschwindet die Bildlaufleiste nach dem Entfernen natürlich. Wenn es sich um eine Bildlaufleiste handelt, die in einem Iframe angezeigt wird, können Sie die Bildlaufleiste horizontal ausblenden, wenn Sie sie sichtbar oder overflow-y:hidden ausblenden möchten.


Verwandte Lektüre:

CSS-Ripple-Animation

Mehrere Möglichkeiten zum Einfügen von Leerzeichen in HTML-Methoden


HTML-Dom-Element hinzufügen oder entfernen

Das obige ist der detaillierte Inhalt vonSo legen Sie die Bildlaufleiste in DIV fest. 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

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

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)

Wie legt man den geplanten Zeitpunkt für die Veröffentlichung von Werken auf Douyin fest? Wie wird die Videodauer eingestellt? Wie legt man den geplanten Zeitpunkt für die Veröffentlichung von Werken auf Douyin fest? Wie wird die Videodauer eingestellt? Mar 27, 2024 pm 06:11 PM

Das Veröffentlichen von Werken auf Douyin kann mehr Aufmerksamkeit und Likes erregen, aber manchmal kann es für uns schwierig sein, Werke in Echtzeit zu veröffentlichen. In diesem Fall können wir die Funktion zur geplanten Veröffentlichung von Douyin nutzen. Mit der geplanten Veröffentlichungsfunktion von Douyin können Benutzer Werke automatisch zu geplanten Zeiten veröffentlichen, wodurch der Veröffentlichungsplan besser geplant und die Bekanntheit und der Einfluss der Werke erhöht werden können. 1. Wie legt man den geplanten Zeitpunkt für die Veröffentlichung von Werken auf Douyin fest? Um eine geplante Veröffentlichungszeit festzulegen, gehen Sie zunächst auf die persönliche Homepage von Douyin, suchen Sie die Schaltfläche „+“ in der oberen rechten Ecke und klicken Sie, um die Veröffentlichungsseite aufzurufen. In der unteren rechten Ecke der Veröffentlichungsseite befindet sich ein Uhrensymbol. Klicken Sie hier, um die Schnittstelle für geplante Veröffentlichungen aufzurufen. In der Benutzeroberfläche können Sie die Art der Arbeit auswählen, die Sie veröffentlichen möchten, einschließlich kurzer Videos, langer Videos und Live-Übertragungen. Als nächstes müssen Sie festlegen, wann Ihre Arbeit veröffentlicht werden soll. TikTok bietet

Wo ist das Douyin-Tag gesetzt? Wie kann es markiert werden, damit es korrekt gepusht werden kann? Wo ist das Douyin-Tag gesetzt? Wie kann es markiert werden, damit es korrekt gepusht werden kann? Mar 27, 2024 am 11:01 AM

Als eine der beliebtesten Kurzvideoplattformen der Welt ermöglicht Douyin jedem, zum Schöpfer zu werden und jeden Moment im Leben zu teilen. Für Douyin-Benutzer sind Tags eine sehr wichtige Funktion. Sie können Benutzern helfen, Inhalte besser zu klassifizieren und abzurufen, und ermöglichen es der Plattform außerdem, geeignete Inhalte genauer an Benutzer weiterzuleiten. Wo werden also die Douyin-Tags gesetzt? In diesem Artikel wird ausführlich erläutert, wie Sie Tags auf Douyin einrichten und verwenden. 1. Wo wird das Douyin-Tag gesetzt? Die Verwendung von Tags auf Douyin kann Benutzern helfen, ihre Werke besser zu klassifizieren und zu kennzeichnen, sodass andere Benutzer sie leichter finden und ihnen folgen können. Die Methode zum Festlegen des Etiketts ist wie folgt: 1. Öffnen Sie die Douyin-App und melden Sie sich bei Ihrem Konto an. 2. Klicken Sie auf das „+“-Zeichen am unteren Bildschirmrand und wählen Sie die Schaltfläche „Veröffentlichen“. 3.

So richten Sie geplante Veröffentlichungen auf Weibo ein_Tutorial zum Einrichten geplanter Veröffentlichungen auf Weibo So richten Sie geplante Veröffentlichungen auf Weibo ein_Tutorial zum Einrichten geplanter Veröffentlichungen auf Weibo Mar 29, 2024 pm 03:51 PM

1. Öffnen Sie den Weibo-Client, klicken Sie auf der Bearbeitungsseite auf die drei kleinen Punkte und dann auf Geplanter Beitrag. 2. Nachdem Sie auf „Geplante Veröffentlichung“ geklickt haben, wird auf der rechten Seite der Veröffentlichungszeit eine Zeitoption angezeigt. Legen Sie die Zeit fest, bearbeiten Sie den Artikel und klicken Sie auf die gelben Wörter in der unteren rechten Ecke, um ihn regelmäßig zu veröffentlichen. 3. Die mobile Version von Weibo unterstützt derzeit keine geplante Veröffentlichung. Diese Funktion kann nur auf dem PC-Client verwendet werden!

„Bitte nicht stören'-Modus funktioniert auf dem iPhone nicht: Behebung „Bitte nicht stören'-Modus funktioniert auf dem iPhone nicht: Behebung Apr 24, 2024 pm 04:50 PM

Selbst das Beantworten von Anrufen im Modus „Bitte nicht stören“ kann ein sehr lästiges Erlebnis sein. Wie der Name schon sagt, deaktiviert der Modus „Bitte nicht stören“ alle Benachrichtigungen über eingehende Anrufe und Warnungen von E-Mails, Nachrichten usw. Sie können diesen Lösungssätzen folgen, um das Problem zu beheben. Fix 1 – Fokusmodus aktivieren Aktivieren Sie den Fokusmodus auf Ihrem Telefon. Schritt 1 – Wischen Sie von oben nach unten, um auf das Kontrollzentrum zuzugreifen. Schritt 2 – Aktivieren Sie als Nächstes den „Fokusmodus“ auf Ihrem Telefon. Der Fokusmodus aktiviert den „Bitte nicht stören“-Modus auf Ihrem Telefon. Es werden keine Benachrichtigungen über eingehende Anrufe auf Ihrem Telefon angezeigt. Fix 2 – Fokusmodus-Einstellungen ändern Wenn es Probleme mit den Fokusmoduseinstellungen gibt, sollten Sie diese beheben. Schritt 1 – Öffnen Sie Ihr iPhone-Einstellungsfenster. Schritt 2 – Als nächstes schalten Sie die Fokusmodus-Einstellungen ein

So stellen Sie den Countdown für den Ticketkauf in Damai ein So stellen Sie den Countdown für den Ticketkauf in Damai ein Apr 01, 2024 pm 07:01 PM

Beim Kauf von Tickets auf Damai.com können Benutzer eine schwebende Uhr einstellen, um Tickets zu erhalten, um sicherzustellen, dass die Ticketkaufzeit genau erfasst werden kann. Die detaillierte Einstellungsmethode finden Sie unten. Lassen Sie uns gemeinsam lernen. So binden Sie die Floating Clock an Damai 1. Klicken Sie, um die Floating Clock-App auf Ihrem Telefon zu öffnen, um die Benutzeroberfläche aufzurufen, und klicken Sie auf den Ort, an dem der Flash-Sale-Check eingestellt ist, wie in der Abbildung unten gezeigt: 2. Nachdem Sie angekommen sind Klicken Sie auf der Seite zum Hinzufügen neuer Datensätze auf Damai.com. Kopieren Sie die Seite mit dem Link zum Ticketkauf. 3. Legen Sie als Nächstes unten die Flash-Sale-Zeit und die Benachrichtigungszeit fest, schalten Sie den Schalter hinter [Im Kalender speichern] ein und klicken Sie unten auf [Speichern]. 4. Klicken Sie, um [Countdown] zu aktivieren, wie in der Abbildung unten gezeigt: 5. Wenn die Erinnerungszeit gekommen ist, klicken Sie unten auf die Schaltfläche [Bild-in-Bild starten]. 6. Wann der Ticketkaufzeitpunkt kommt

Wo werden Douyin-Empfehlungen und -Auswahlen festgelegt? Wo werden Douyin-Empfehlungen und -Auswahlen festgelegt? Mar 27, 2024 pm 05:06 PM

Wo sind die Empfehlungen und Auswahlmöglichkeiten für Douyin-Kurzvideos? Die meisten Benutzer wissen nicht, wie sie Empfehlungen und Auswahlmöglichkeiten für die Benutzer festlegen. Audio-Empfehlungen und ausgewählte Tutorials zu Einstellmethoden, interessierte Nutzer kommen vorbei! Tutorial zur Douyin-Nutzung Wo man Douyin-Empfehlungen und -Auswahlen einrichtet 1. Öffnen Sie zunächst die Douyin-Kurzvideo-APP und rufen Sie die Hauptseite auf, klicken Sie auf den Bereich [Ich] in der unteren rechten Ecke und wählen Sie [drei horizontale Linien] in der oberen rechten Ecke aus ; 2. Dann wird die Funktionsleiste auf der rechten Seite erweitert. Wählen Sie unten die Seite „Einstellungen“ aus. 3. Suchen Sie dann auf der Funktionsseite „Persönliche Informationen“ nach dem Dienst Informationsverwaltungsseite, Folie [Personalisierte Inhaltsempfehlungen] 】Die Schaltfläche auf der Rückseite kann eingestellt werden.

So setzen Sie das Wasserzeichen in der Mitte auf Weibo_So setzen Sie das Wasserzeichen in der Mitte auf Weibo So setzen Sie das Wasserzeichen in der Mitte auf Weibo_So setzen Sie das Wasserzeichen in der Mitte auf Weibo Mar 29, 2024 pm 03:31 PM

1. Geben Sie zunächst Weibo ein, klicken Sie dann unten rechts auf „Ich“ und wählen Sie „Kundenservice“. 2. Geben Sie dann [Wasserzeichen] in das Suchfeld ein und wählen Sie [Weibo-Bildwasserzeichen festlegen]. 3. Klicken Sie dann in der Benutzeroberfläche auf [Link]. 4. Klicken Sie dann im neu geöffneten Fenster auf [Einstellungen für Bildwasserzeichen]. 5. Aktivieren Sie abschließend [Picture Center] und klicken Sie auf [Speichern].

So stellen Sie die Eingabetaste ein, um Nachrichten in QQ zu senden So stellen Sie die Eingabetaste ein, um Nachrichten in QQ zu senden Mar 25, 2024 pm 07:10 PM

1. Klicken Sie zunächst auf den Desktop des Mobiltelefons, um QQ aufzurufen, und klicken Sie dann auf den Avatar in der oberen linken Ecke. 2. Klicken Sie unten links auf [Einstellungen]. 3. Klicken Sie, um [Barrierefreiheit] zu öffnen. 4. Dann müssen wir nur noch auf den Schalter [Eingabetaste zum Senden der Nachricht] klicken.

See all articles