HTML: Ändern der Farben bestimmter Wörter in einer Textfolge
Ich habe die folgende Nachricht (etwas geändert):
"Nehmen Sie am Wettbewerb am 30. Januar 2011 teil und gewinnen Sie bis $$$$ - inklusive toller Sommerreisen!"
Ich habe momentan:
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
formatieren der Textzeichenfolge, aber möchten die Farbe von "30. Januar 2011" in # FF0000 und "Sommer" in # 0000A0 ändern.
Wie mache ich das streng mit HTML oder Inline-CSS?
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
Enter the competition by
<span style="color: #ff0000">January 30, 2011</span>
and you could win up to $$$$ — including amazing
<span style="color: #0000a0">summer</span>
trips!
</p>
Oder Sie möchten stattdessen CSS-Klassen verwenden:
<html>
<head>
<style type="text/css">
p {
font-size:14px;
color:#538b01;
font-weight:bold;
font-style:italic;
}
.date {
color: #ff0000;
}
.season { /* OK, a bit contrived... */
color: #0000a0;
}
</style>
</head>
<body>
<p>
Enter the competition by
<span class="date">January 30, 2011</span>
and you could win up to $$$$ — including amazing
<span class="season">summer</span>
trips!
</p>
</body>
</html>
Sie können das HTML5-Tag <mark> verwenden:
<p>Enter the competition by
<mark class="red">January 30, 2011</mark> and you could win up to $$$$ — including amazing
<mark class="blue">summer</mark> trips!</p>
Und verwende das im CSS:
p {
font-size:14px;
color:#538b01;
font-weight:bold;
font-style:italic;
}
mark.red {
color:#ff0000;
background: none;
}
mark.blue {
color:#0000A0;
background: none;
}
Das Tag <mark> hat eine Standardhintergrundfarbe ... zumindest in Chrome.
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
Enter the competition by <span style="color:#FF0000">January 30, 2011</span> and you could win up to $$$$ — including amazing <span style="color:#0000A0">summer</span> trips!
</p>
Die Span-Elemente sind inline und unterbrechen somit nicht den Fluss des Absatzes, sondern nur den Stil zwischen den Tags.
verwenden Sie Spannweiten. ex) <span style='color: #FF0000;'>January 30, 2011</span>
<font color="red">This is some text!</font>
Das funktionierte am besten für mich, als ich nur ein Wort in die rote Farbe eines Satzes ändern wollte.
Passen Sie diesen Code an, wie auch immer Sie Ihren Bedürfnissen entsprechen möchten. Sie können Text auswählen. In dem Absatz wird angegeben, welche Schriftart oder welcher Stil Sie benötigen !:
<head>
<style>
p{ color:#ff0000;font-family: "Times New Roman", Times, serif;}
font{color:#000fff;background:#000000;font-size:225%;}
b{color:green;}
</style>
</head>
<body>
<p>This is your <b>text. <font>Type</font></strong></b>what you like</p>
</body>
Sie können auch eine Klasse machen:
<span class="mychangecolor"> I am in yellow color!!!!!!</span>
dann in einer CSS-Datei:
.mychangecolor{ color:#ff5 /* it changes to yellow */ }
Sie könnten den längeren Böringer-Weg verwenden
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">Enter the competition by</p><p style="font-size:14px; color:#ff00; font-weight:bold; font-style:italic;">summer</p> sie erhalten den Punkt für den Rest
Wenn Sie eine Bibliothek verwenden möchten, kann Azle dies problemlos tun. Einfach Ziel die class - und class-Instanz Ihres Textelements. Wenn sich beispielsweise mein Textblock in einem Element mit der Klasse "my_text" befindet und es sich um die erste Instanz dieser Klasse handelt:
az.style_Word('my_text', 1, {
"this_class" : "colored_Word",
"Word" : "deploy",
"color" : "red",
"Word_instance" : 2
})
Das Folgende zeigt, wie wir jede Instanz des Wortes färben oder auf die 1., 2. oder 3. Instanz des Wortes insbesondere zielen können:
Hier ist die GEIGE