html style programmieren

Registriert
Juni 2014
Beiträge
4
Bin neu hier mir einer Frage.
Endlich funktioniert das - jetzt würde ich nur noch gerne die Schriftgröße und -farbe verändern. Finde aber nicht die richtige Stelle, wo ich das erfolgreich eingeben kann... Kann jemand helfen? DANKE

<p>
*
</p>

<p style="font-size: 24px; text-align: left;">
*
</p>

<p style="font-size: 24px; text-align: center;">
*
</p>

<p style="font-size: 24px; text-align: center;">
*
</p>

<p style="font-size: 24px; text-align: center;">
*
</p>

<p style="font-size: 24px; text-align: center;">
*
</p>

<p>
<script type="text/javascript">
// <![CDATA[
function aufploppen() {
var text = new Array();
text[0] = "Die Freude am Herrn ist eure Stärke. (Nehemia 8,10)";
text[1] = "Nikodemus spricht zu ihm: Wie kann ein Mensch geboren werden, wenn er alt ist? Kann er denn wieder in seiner Mutter Leib";
text[2] = "Der Gott der Hoffnung aber erfülle euch mit aller Freude und mit allem Frieden im Glauben, damit ihr reich werdet an Hoffnung in der Kraft des Heiligen Geistes. (Römer 15,13)";
text[3] = "Selig die Trauernden, denn sie werden getröstet werden. (Matthäus 5,4)";
text[4] = "Auf, werde licht denn es kommt dein Licht /und die Herrlichkeit des Herrn geht leuchtend auf über dir. (Jesaja 60,1)";
text[5] = "Blickt auf zu ihm, so wird euer Gesicht leuchten /und ihr braucht nicht zu erröten. (Psalm 34,6)"; // usw.

var x = Math.round(Math.random()*(text.length-1));
document.getElementById("tooltip").innerHTML = text[x];
document.getElementById("tooltip").style.display="block";
window.setTimeout("machzu()", 100500); // Millisekunden
}

function machzu() {
document.getElementById("tooltip").style.display="none";
}

document.onload = window.setTimeout("aufploppen()", 1000);
// ]]>
</script>
</p>

<div id="tooltip" style="display: none;">
*
</div>
 
font-size: 24px = Textgröße

color: #000 = Farbe (schwarz) oder color: #FFF (weiß)
 
Von welchem Element soll die Größe verändert werden?

Um CSS einzubinden, kannst du entweder im <head>-Bereich ein externes Stylesheet laden:
HTML:
<link rel="stylesheet" type="text/css" href="style.css">
Alternativ kannst du auch ein direkt eingebettetes CSS verwenden:
HTML:
<style>
p {
  font-size: 18px;
}
</style>
... verändert die Schriftgröße aller <p>-Tags, soweit sie nicht bereits eine Inline-Style-Eigenschaft besitzen, wie bei deinem Beispiel die <p>-Tags 2-6 (z.B. style="font-size: 24px; text-align: left;").
 
Also der Text [0] und [1] soll größer werden - und ich weiß nicht, wo ich das "font-size=36px" hinschreiben muss:

<p>
<script type="text/javascript">
// <![CDATA[
function aufploppen() {
var text = new Array();
text[0] = "Nikodemus spricht zu ihm: Wie kann ein Mensch geboren werden, wenn er alt ist?";
text[1] = "Kann er denn wieder in seiner Mutter Leib"; // usw.

var x = Math.round(Math.random()*(text.length-1));
document.getElementById("tooltip").innerHTML = text[x];
document.getElementById("tooltip").style.display="block";
window.setTimeout("machzu()", 10500); // Millisekunden
}

function machzu() {
document.getElementById("tooltip").style.display="none";
}

document.onload = window.setTimeout("aufploppen()", 2000);
// ]]>
</script>
</p>

<div id="tooltip" style="display: none;">
*
</div>
 
Im Idealfall bearbeitest du die .css - Datei, in der die anderen Styles der Seite definiert sind. So macht man es richtig. Wenn das nicht möglich ist, oder aber (so wie das hier aussieht) jemand ohne auch nur ansatzweise einem sauberen Arbeitsstil hier rumgemurkst hat, dann musst du den Kram halt in den <head> schreiben.

HTML:
<head>
<!-- Hier steht schon was, wie z.B. <title> oder <meta>-Tags -->

<style>
#tooltip {
font-size: 2em;
}
</style>
</head>

Wenn gar nichts geht, weil du nicht einmal auf den <head> zugreifen kannst, dann gehört sich die Font-Size in das Element mit der ID "tooltip".
 
Zurück
Oben