Depot43-Unterlagen

HTML Elemente

            
            

<!doctype html>
<html lang="de">
<head>
    <meta charset=utf-8>
    <title>Bootstrap CDN</title>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <style>
    
    </style>

</head>
<body>

	<div class="well well-lg">
		<ul class="list-inline"> 
			<li><a href="" data-toggle="tooltip" data-placement="top" title="Ganz oben">Top</a></li>
			<li><a href="" data-toggle="tooltip" data-placement="bottom" title="Tief unten">Bottom</a></li>
			<li><a href="" data-toggle="tooltip" data-placement="left" title="Linke Meldung">Left</a></li>
			<li><a href="" data-toggle="tooltip" data-placement="right" title="Rechte Meldung">Right</a></li>
		</ul> 
	</div>


</body>
</html>


 

            

Bemerkung:

Ein modales Fenster braucht jQuery und ein kleines Javascript als Aufruf.

Die Möglichkeiten einen Tooltip mit CSS zu formatieren sind begrenzt, er wird vom Browser mit Javascript erzeugt und ausgegeben. Von Bootstrap wird er überschrieben. Die Anzeige des Bootstrap-Tooltips ist auf allen Browsern identisch.