Toen webdesigners begon met behulp van Cascading Style Sheet code, gebruikte ze het instellen van lettertypen en kleuren naar hele websites om te voorkomen dat elke HTML-bestand bewerken. Sinds ongeveer 2008 gebruik webdesigners nu CSS om ook openstelling van hun grafische bewerkingsprogramma's. Pure CSS kunt u semi-transparante achtergronden toevoegen aan inhoud op een webpagina, bijvoorbeeld. In het verleden vereist dit een PNG-bestand maken en vervolgens toe te voegen een PNG fix voor Internet Explorer 6. Internet Explorer versie 8 en hieronder nog nodig een terugval, maar kunt u deze toevoegen met behulp van een filter.
Open het HTML-bestand van de webpagina die u wilt bewerken. Gebruik een code-editor, zoals jEdit, Notepad ++ of BBEdit. HTML tags komen in paren met een openings- en een eindtag, en inhoud die zijn getroffen door de tags is omsloten hen. Vinden de tags rond de inhoud die u wilt geven een een semi-transparante achtergrond. Hier is een voorbeeld:
Inhoud...Open het CSS-bestand voor uw website in de code-editor. Als uw website maakt geen gebruik van een CSS-bestand, voeg CSS-code tussen codes tussen de
Tags op uw HTML-bestand. Voeg deze CSS-code toe:div #box .blue {}
De tekst vóór de accolades zijn CSS selectors. De eerste selector selecteert door labelnaam, de tweede selecteert door de ID en de laatste selecteert door de klassenaam van de. U hoeft alleen een selector, maar u kunt meerdere selectors toevoegen, zoals in het voorbeeld. Informatie u in de HTML-tags vindt te schrijven uw selectors gebruiken.
Toevoegen uw CSS-opmaakregels tussen de accolades. Gebruik de RGBa--rode, groene en blauwe kleur met alpha transparantie--u een semi-transparante kleur instellen op de achtergrond. De rode, groene en blauwe kleurwaarden ophalen in uw grafische programma of ze een kleur-plukkend het hulpprogramma op het Internet vinden. De code ziet er zo uit:
.Blue {}
background-color: rgba(0,0,255,0.5);
}
Het bovenstaande voorbeeld maakt de achtergrondkleur blauw met een dekking van 50 procent. De laatste waarde in de vier-nummer is ingesteld op "1" om de kleur van een volledige-dekking.
Voeg de volgende code tussen de
Tags van uw HTML-bestand de semi-transparante achtergrondkleur om compatibel te maken met Internet Explorer 8 en hieronder:Vervangen van de eerste zes cijfers na "startColorstr =" met de hexadecimale kleurcode, die u kunt vinden met behulp van een color picker tool op het Internet. De laatste twee cijfers wordt vervangen door het percentage van de dekking die u, zoals "50" voor 50 procent of "75" voor 75 procent wilt. Controleer de waarde van "endColorstr" gelijk aan "startColorstr".