Sono molto nuovo in HTML / CSS e sto cercando di visualizzare del testo come trasparente al 50%. Finora ho l'HTML per visualizzare il testo con piena opacità
<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>Tuttavia, non sono sicuro di come modificare la sua opacità. Ho provato a cercare online, ma non sono sicuro di cosa fare con il codice che trovo.
Risposte:
opacitysi applica all'intero elemento, quindi se hai uno sfondo, un bordo o altri effetti su quell'elemento, anche questi diventeranno trasparenti. Se vuoi solo che il testo sia trasparente, usa rgba.
#foo {
color: #000; /* Fallback for older browsers */
color: rgba(0, 0, 0, 0.5);
font-size: 16pt;
font-family: Arial, sans-serif;
}Inoltre, sterza molto, molto lontano da <font>. Abbiamo CSS per questo ora.
rgba.
Controlla l' opacità , puoi impostare questa proprietà CSS sul div, il <p>o usando <span>che vuoi rendere trasparente
E a proposito, il tag del font è deprecato , usa css per modellare il testo
div {
opacity: 0.5;
} Modifica: questo codice renderà l'intero elemento trasparente, se vuoi rendere trasparente ** solo il testo ** controlla la risposta di Mattias Buelens
Usa il rgbatag come colore del testo. Potresti usare opacity, ma ciò influenzerebbe l'intero elemento, non solo il testo. Supponi di avere un bordo, lo renderebbe anche trasparente.
.text
{
font-family: Garamond, serif;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}La soluzione migliore è guardare il tag "opacity" di un elemento.
Per esempio:
.image
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}Quindi nel tuo caso dovrebbe assomigliare a:
<html><span style="opacity: 0.5;"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>Tuttavia, non dimenticare che il tag non è supportato in HTML5.
Dovresti usare anche un CSS :)
E l' opacityattributo css ? 0ai 1valori.
Ma allora probabilmente avrai bisogno di usare un elemento dom più esplicito di "font". Per esempio:
<html><body><span style=\"opacity: 0.5;\"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></span></body></html>Come informazione aggiuntiva, ti suggerirei ovviamente di utilizzare le dichiarazioni CSS al di fuori dei tuoi elementi html, ma anche di provare a utilizzare lo stile css del carattere invece del tag html del carattere.
Per il generatore di stili CSS3 cross browser, dai un'occhiata a http://css3please.com/
Facile! dopo il tuo:
<font color=\"black\" face=\"arial\" size=\"4\">aggiungi questo:
<font style="opacity:.6"> devi solo cambiare ".6" per un numero decimale compreso tra 1 e 0
Non esiste una proprietà CSS come l'opacità dello sfondo che puoi utilizzare solo per modificare l'opacità o la trasparenza dello sfondo di un elemento senza influire sugli elementi figli, d'altra parte se proverai a utilizzare la proprietà Opacità CSS non cambierà solo la opacità dello sfondo, ma cambia anche l'opacità di tutti gli elementi figlio. In tale situazione è possibile utilizzare il colore RGBA introdotto in CSS3 che include la trasparenza alfa come parte del valore del colore. Usando il colore RGBA puoi impostare il colore dello sfondo e la sua trasparenza.
prova a giocare con mix-blend-mode: multiply;
color: white;
background: black;
mix-blend-mode: multiply;