Mittwoch, 24. Juli 2019

07:03

Homepage-Tipps & -tricks für Webmaster mit CSS

Scrollbare Div-Box anstatt Iframe

Es muß nicht immer gleich ein Iframe sein ...
Alternativ zum Iframe kann auch eine scrollbare Div-Box zum Einsatz kommen. Diese Box lässt sich vielfältig formatieren und hat darüber hinaus noch den Vorteil, dass sie W3C-konform ist! Nachfolgend zeigen wir Ihnen anhand eines Beispiels, wie das mit ein wenig CSS zu bewerkstelligen ist:

Anweisung in der CSS-Datei:

.box
{
width: 350px;
height: 150px;
overflow: auto;
font-family: Arial, Helvetica, Tahoma;
font-size: 12px;
background-color: #666;
color: #FF9933;
padding: 5px;
text-align: justify;
}

Anweisung im Html-Dokument:

<html>
<head>
<title>Div-Box</title>
<link rel="stylesheet" type="text/css" href="css/box.css">
</head>
<body>
<div class="box">
Text Text Text Text ...
</div>
</body>
</html>

Beispiel ansehen

Tipp: Mit der Anweisung "overflow: auto" in der CSS-Datei lässt sich die Scrollbar der Box je nach Inhalt automatisch aktivieren bzw. deaktivieren!

[ veröffentlicht am 03.05.2008 ] __________________________

Das könnte Sie vielleicht auch interessieren:

[ Mouseover-Info-Box mit CSS kreieren, formatieren und gestalten ]
[ Info-Box "Deluxe" mit 'legend' & 'fieldset' hervorheben ]





© 2007 - 2019 Copyright by homepage-vorlagen-webdesign.de | Hosted by 1&1 Internet SE

Diese Seite wurde zuletzt am 02.06.2018 17:21 aktualisiert.