Ik ben erg nieuw in HTML/CSS en ik probeer wat tekst weer te geven als 50% transparant. Tot nu toe heb ik de HTML om de tekst met volledige dekking weer te geven
<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
Ik weet echter niet zeker hoe ik de dekking moet wijzigen. Ik heb geprobeerd online te zoeken, maar ik weet niet precies wat ik moet doen met de code die ik vind.
Antwoord 1, autoriteit 100%
opacityis van toepassing op het hele element, dus als je een achtergrond, rand of andere effecten op dat element hebt, worden die ook transparant. Als u alleenwilt dat de tekst transparant is, gebruikt u rgba.
#foo {
color: #000; /* Fallback for older browsers */
color: rgba(0, 0, 0, 0.5);
font-size: 16pt;
font-family: Arial, sans-serif;
}
Blijf ook ver, ver weg van <font>. Daar hebben we nu CSS voor.
Antwoord 2, autoriteit 38%
Controleer Dekking, U kunt deze css-eigenschap instellen op de div, de <p>of gebruik <span>die je transparant wilt maken
En trouwens, de font-tag is verouderd, gebruik css om de tekst op te maken
div {
opacity: 0.5;
}
Bewerken: deze code maakt het hele element transparant, als je ** alleen de tekst ** transparant wilt maken, vink dan @Mattias Buelens antwoord aan
Antwoord 3, autoriteit 6%
Gebruik gewoon de rgba-tag als uw tekstkleur. Je zou opacitykunnen gebruiken, maar dat zou het hele element beïnvloeden, niet alleen de tekst. Stel dat je een rand hebt, dan wordt die ook transparant.
.text
{
font-family: Garamond, serif;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}
Antwoord 4, autoriteit 3%
Je beste oplossing is om naar de “opacity”-tag van een element te kijken.
Bijvoorbeeld:
.image
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
Dus in jouw geval zou het er ongeveer zo uit moeten zien:
<html><span style="opacity: 0.5;"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
Vergeet echter niet dat de tag niet wordt ondersteund in HTML5.
Je zou ook een CSS moeten gebruiken 🙂
Antwoord 5, autoriteit 2%
Hoe zit het met het css opacityattribuut? 0tot 1waarden.
Maar dan moet je waarschijnlijk een explicieter dom-element gebruiken dan “font”. Bijvoorbeeld:
<html><body><span style=\"opacity: 0.5;\"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></span></body></html>
Als aanvullende informatie raad ik je natuurlijk aan om CSS-declaraties buiten je html-elementen te gebruiken, maar probeer ook de font css-stijl te gebruiken in plaats van de font html-tag.
Voor een cross-browser css3-stijlgenerator, kijk op http://css3please.com/
Antwoord 6
Eenvoudig! na uw:
<font color=\"black\" face=\"arial\" size=\"4\">
voeg deze toe:
<font style="opacity:.6">
je hoeft alleen maar de “.6” te veranderen voor een decimaal getal tussen 1 en 0
Antwoord 7
Er is geen CSS-eigenschap zoals background-opacity die u alleen kunt gebruiken voor het wijzigen van de dekking of transparantie van de achtergrond van een element zonder de onderliggende elementen te beïnvloeden, aan de andere kant, als u probeert de CSS-ondoorzichtigheidseigenschap te gebruiken, verandert niet alleen de dekking van de achtergrond, maar verandert ook de dekking van alle onderliggende elementen.
In een dergelijke situatie kunt u RGBA-kleur gebruiken die in CSS3 is geïntroduceerd en die alfatransparantie als onderdeel van de kleurwaarde bevat. Met RGBA-kleur kunt u zowel de kleur van de achtergrond als de transparantie instellen.
Antwoord 8
probeer wat te spelen met mix-blend-mode: multiply;
color: white;
background: black;
mix-blend-mode: multiply;
Antwoord 9
Als u opacitygebruikt voor een element, heeft een volledig element effect dat (achtergrond+andere dingen erin), u kunt mix-blend-modegebruiken voor de CSS-attributen van het specifieke element,
Verwijs naar deze sites:
https://css-tricks.com/almanac/ eigenschappen/m/mix-blend-mode/