diedVIPs

html knowhow

Buttons Schriftgröße ändern














Buttons Schriftgröße ändern

Alles, was zwisch <p>...</p> steht, wird verändert
So sieht´s aus


| |

Htmlknowhow möchte Ihnen keine Lehrstunde in html, css oder Java geben,
sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich
verbessern können. Html, CSS und Java bieten da super Möglichkeiten der Webseiten-Gestaltung.
Bevor Sie aber mit Ihrem Homepage-Projekt beginnen, sollten Sie sich über Grundsätzliches informieren,
damit Sie wissen, was alles auf Sie zukommt. Ich gebe Homepage-Designern Tipps,
wie sie ihren Webauftritt verbessern können.

Quelltext

<html>
<head>

<style type="text/css">
p {clear:right; font-size:15px;}
.resizable {font-size:15px;}
#span {font-size:25px; text-align:center; display:block; font-weight:bold;}
a {color: blue; cursor:pointer}
a:hover {color: red;cursor:pointer}
</style>
</head>

<body>
<center>
<span id="span">
<a class="increase">&#9650;</a> |
<a class="decrease">&#9660;</a> |
<a class="reset">&#8634;</a>
</span>
<div class="resizable"><p>Htmlknowhow möchte Ihnen keine Lehrstunde in html, css oder Java geben,<br/>
sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich<br/>
verbessern können. Html, CSS und Java bieten da super Möglichkeiten der Webseiten-Gestaltung. <br/>
Bevor Sie aber mit Ihrem Homepage-Projekt beginnen, sollten Sie sich über Grundsätzliches informieren, <br/>
damit Sie wissen, was alles auf Sie zukommt. Ich gebe Homepage-Designern Tipps,<br/>
wie sie ihren Webauftritt verbessern können.</div> </center>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var resize = new Array('p', '.resizable');
resize = resize.join(',');
//resets the font size when "reset" is clicked
var resetFont = $(resize).css('font-size');
$(".reset").click(function() {
$(resize).css('font-size', resetFont); });
//increases font size when "+" is clicked
$(".increase").click(function() {
var originalFontSize = $(resize).css('font-size');
var originalFontNumber = parseFloat(originalFontSize, 10);
var newFontSize = originalFontNumber * 1.2;
$(resize).css('font-size', newFontSize);
return false; });
//decrease font size when "-" is clicked
$(".decrease").click(function() {
var originalFontSize = $(resize).css('font-size');
var originalFontNumber = parseFloat(originalFontSize, 10);
var newFontSize = originalFontNumber * 0.8;
$(resize).css('font-size', newFontSize);
return false;
}); });
</script>
</body>

</html>







Kontakt    Datenschutz    Impressum