Lorsque les concepteurs Web ont commencé à utiliser Cascading Style Sheet code, ils l`ont utilisé pour définir les polices et les couleurs pour des sites entiers pour éviter d`éditer tous les fichiers HTML. Depuis environ 2008, les concepteurs Web utilisent maintenant CSS pour éviter également l`ouverture de leurs graphiques programmes d`édition. Vous pouvez utiliser pure CSS pour ajouter des fonds semi-transparents à tout contenu sur une page Web, par exemple. Dans le passé, cela nécessite la création d`un fichier PNG, puis en ajoutant une solution de PNG pour Internet Explorer 6. Internet Explorer versions 8 et ci-dessous encore besoin d`un repli, mais vous pouvez l`ajouter à l`aide d`un filtre.
Ouvrez le fichier HTML de la page Web que vous souhaitez modifier. Utilisez un éditeur de code, comme jEdit, Notepad ++ ou BBEdit. Les balises HTML viennent en paires avec une ouverture et une balise de fermeture, et le contenu affecté par les balises est enfermé en leur sein. Trouver les balises entourant le contenu que vous souhaitez donner un fond semi-transparent. Voici un exemple:
Contenu...Ouvrez le fichier CSS pour votre site Web dans l`éditeur de code. Si votre site ne pas utiliser un fichier CSS, ajoutez le code CSS entre les balises entre le
tags sur votre fichier HTML. Ajouter ce code CSS:div #box .blue {}
Le texte devant les accolades sont sélecteurs CSS. Le premier sélecteur sélectionne par nom de tag, le second sélectionne par ID et les derniers sélectionne par nom de classe. Vous avez seulement besoin d`un sélecteur, mais vous pouvez ajouter plusieurs sélecteurs comme indiqué dans l`exemple. Utilisez les informations que vous trouverez dans les balises HTML pour écrire vos sélecteurs.
Ajouter vos règles de style CSS entre les accolades. Utilisez RGBA - rouge, vert et bleu avec transparence alpha - pour définir une couleur semi-transparente à l`arrière-plan. Obtenez les valeurs de rouge, vert et bleu à partir de votre programme graphique ou les trouver en utilisant un outil de prélèvement des pipettes sur Internet. Le code ressemble à ceci:
.bleu {
background-color: rgba (0,0,255,0.5);
}
L`exemple ci-dessus rend la couleur de fond bleu avec 50 pour cent d`opacité. Réglez la dernière valeur dans les quatre-nombre réglé sur "1" pour une couleur pleine opacité.
Ajoutez le code suivant entre le
Tags de votre fichier HTML pour rendre la couleur de fond semi-transparent compatible avec Internet Explorer 8 et ci-dessous:Remplacer les six premiers chiffres après "startColorstr =" avec le code couleur hexadécimal, que vous pouvez trouver en utilisant un outil de sélecteur de couleur sur l`Internet. Remplacer les deux derniers chiffres avec le pourcentage d`opacité que vous voulez, comme "50" 50 pour cent ou "75" 75 pour cent. Faire la valeur de "endColorstr" identique à "startColorstr".
