recherche
Maisoninterface Webjs tutorielRésumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript

FF et IE7 prennent déjà directement en charge les images PNG transparentes. Le suivant est principalement utilisé pour résoudre le problème du fond gris dans les images PNG transparentes sous IE6

Copier le code Le code est le suivant :

style="FILTRE : progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/fl.png')"

Syntaxe :
filtre : progid:DXImageTransform.Microsoft.AlphaImageLoader ( activé=bEnabled , sizingMethod=sSize , src=sURL )

activé : facultatif. Booléen. Définit ou récupère si le filtre est actif. vrai | faux vrai : valeur par défaut. Filtre activé.
false : le filtre est désactivé.

sizingMethod : Facultatif. Chaîne. Définit ou récupère la manière dont l'image de l'objet filtré est affichée dans les limites du conteneur d'objets. crop : recadre l'image pour l'adapter aux dimensions de l'objet.
image : valeur par défaut. Augmentez ou diminuez les limites de taille de l'objet pour l'adapter aux dimensions de l'image.
scale : redimensionnez l'image pour qu'elle s'adapte aux limites de taille de l'objet.

src : obligatoire. Chaîne. Spécifiez l'image d'arrière-plan à l'aide d'une adresse URL absolue ou relative. Si ce paramètre est omis, le filtre n'aura aucun effet.

Caractéristiques :
Activé : Lisible et inscriptible. Booléen. Voir l'attribut activé.
sizingMethod : Lisible et inscriptible. Chaîne. Voir la propriété sizingMethod.
src : lisible et inscriptible. Chaîne. Voir l'attribut src.

Description :
Affiche une image entre l'arrière-plan et le contenu de l'objet, dans les limites du conteneur de l'objet. Et fournissez des opérations de découpe et de redimensionnement de cette image. Si le format PNG (Portable Network Graphics) est chargé, une transparence de 0 à 100 % est également fournie.
La transparence des images au format PNG (Portable Network Graphics) ne vous empêche pas de sélectionner du texte. Autrement dit, vous pouvez choisir d’afficher le contenu derrière la zone totalement transparente de l’image au format PNG (Portable Network Graphics).

Exemple : Résolvez le problème de l'échec de la transparence png sous IE6.

Style CSS :

.png{
_background: url(images/angel.png) no-repeat !important; 
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=noscale, src="images/angel.png");
background:none;
width:118px;height:133px;
}

.png div{position:relative;}

Code HTML :

<div class="png">
<div>
CSS 背景PNG透明 及 链接失效问题解决
</div>
</div>

/*
Compatible avec IE6.0, IE7.0, FF,
IE7.0 et la nouvelle version de FF peuvent réellement le rendre transparent sans ajouter de filtre.
*/

=============================================== === ==============================

Méthode 1 : Définir un style Après avoir appliqué ce style à un certain div, l'image d'arrière-plan png transparente du div deviendra automatiquement transparente. (Notez que les chemins des deux images sont écrits différemment. Dans cet exemple, l'image icon_home.png et le fichier html sont dans le même répertoire)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
.qq {
height: 90px;
width: 90px;
background-image: url(icon_home.png)!important;/* FF IE7 */
background-repeat: no-repeat;

_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon_home.png'); /* IE6 */
_ background-image: none; /* IE6 */
}
-->
</style>
</head>

<body>

<div class="qq"></div>

</body>
</html>

Méthode 2 : Définissez le style pour img, et tous les PNG transparents de la page seront automatiquement transparents. (Cette méthode n'est valable que pour les images directement insérées, pas pour les images d'arrière-plan) Notez que vous devez préparer une petite image transparente transparent.gif, la taille n'est pas limitée. Doit être placé dans le même répertoire que html
Veuillez ne pas l'utiliser en grande quantité, sinon la page s'ouvrira très lentement !!!)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.mypng img {
azimuth: expression(
this.pngSet&#63;this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1&#63;(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg&#63; this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true);
}

</style>
</head>

<body>
换成你的png图片
<div class="mypng">
<img  src="/static/imghwm/default1.png"  data-src="icon_face_07.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" >
<img  src="/static/imghwm/default1.png"  data-src="icon_face_10.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" >
<img  src="/static/imghwm/default1.png"  data-src="icon_face_08.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" >
</div>
</body>
</html>

Méthode 3 : utilisez JS pour l'implémenter. Après avoir ajouté un morceau de code js, tous les png transparents insérés deviendront automatiquement transparents (notez que cette méthode n'est valable que pour les images directement insérées, pas pour. images d'arrière-plan)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="JavaScript"> 
function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6. 
{ 
  var arVersion = navigator.appVersion.split("MSIE") 
  var version = parseFloat(arVersion[1]) 
  if ((version >= 5.5) && (document.body.filters)) 
  { 
    for(var j=0; j<document.images.length; j++) 
    { 
     var img = document.images[j] 
     var imgName = img.src.toUpperCase() 
     if (imgName.substring(imgName.length-3, imgName.length) == "PNG") 
     { 
       var imgID = (img.id) &#63; "id='" + img.id + "' " : "" 
       var imgClass = (img.className) &#63; "class='" + img.className + "' " : "" 
       var imgTitle = (img.title) &#63; "title='" + img.title + "' " : "title='" + img.alt + "' " 
       var imgStyle = "display:inline-block;" + img.style.cssText 
       if (img.align == "left") imgStyle = "float:left;" + imgStyle 
       if (img.align == "right") imgStyle = "float:right;" + imgStyle 
       if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle 
       var strNewHTML = "<span " + imgID + imgClass + imgTitle 
       + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";" 
       + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader" 
       + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
       img.outerHTML = strNewHTML 
       j = j-1 
     } 
    } 
  }   
} 
window.attachEvent("onload", correctPNG); 
</script>
<style type="text/css">
<!--
body {

}
-->
</style></head>

<body>
把图片换成你自己的图片
<img  src="/static/imghwm/default1.png"  data-src="img/icon_face_03.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" ><!--把图片换成你自己的图片 -->
<img  src="/static/imghwm/default1.png"  data-src="img/icon_face_05.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" >
<img  src="/static/imghwm/default1.png"  data-src="img/menu_title_over.png"  class="lazy"    style="max-width:90%"  style="max-width:90%" / alt="Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript" >
</body>
</html> 

Méthode 4

<script language="javascript">
// 修复 IE 下 PNG 图片不能透明显示的问题
function fixPNG(myImage) {
var arVersion = navigator.appVersion.split("MSIE");
var version = parseFloat(arVersion[1]);
if ((version >= 5.5) && (version < 7) && (document.body.filters))
{
   var imgID = (myImage.id) &#63; "id='" + myImage.id + "' " : "";
   var imgClass = (myImage.className) &#63; "class='" + myImage.className + "' " : "";
   var imgTitle = (myImage.title) &#63; "title='" + myImage.title  + "' " : "title='" + myImage.alt + "' ";
   var imgStyle = "display:inline-block;" + myImage.style.cssText;
   var strNewHTML = "<span " + imgID + imgClass + imgTitle

  + " style=\"" + "width:" + myImage.width

  + "px; height:" + myImage.height

  + "px;" + imgStyle + ";"

  + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"

  + "(src=\'" + myImage.src + "\', sizingMethod='scale');\"></span>";
   myImage.outerHTML = strNewHTML;
} } 

window.onload=function(){
     document.getElementById("top").style.height=screen.height/5+"px";
    
}//
</script>

L'utilisation est la suivante :

Copier le code Le code est le suivant :

Résumé des solutions expliquant pourquoi png ne peut pas être transparent sous les techniques IE6_javascript

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.

Déclaration
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
如何在 Windows 11 上将 PNG 转换为 JPG如何在 Windows 11 上将 PNG 转换为 JPGMay 12, 2023 pm 03:55 PM

如何在Windows11上将PNG转换为JPG在Windows10和11上,您可以使用Microsoft内置的Paint应用程序快速转换图像文件。要在Windows11上将PNG图像转换为JPG,请使用以下步骤:打开文件资源管理器并导航到要转换的PNG图像。右键单击图像并从菜单中选择打开方式>绘制。您的照片或图像会在“画图”应用中打开。注意屏幕底部的文件大小。要将文件从PNG转换为JPG,请单击文件并从菜单中选择另存为>JPEG图片。当文件资源

解决win11透明任务栏黑线问题的方法解决win11透明任务栏黑线问题的方法Dec 22, 2023 pm 10:04 PM

很多朋友在使用translucenttb设置透明任务栏之后,发现win11透明任务栏有一条黑线,观感非常难受,这时候应该怎么解决呢,其实在软件里就能解决。win11透明任务栏有一条黑线:方法一:1、根据用户反馈,可以右键translucenttb,打开设置。2、然后将图示选项的“margin”设置为“1”就可以解决了。方法二:1、如果还是不行,可以右键空白处打开“个性化”2、然后在其中选择系统默认的主题更换即可解决。方法三:1、如果都不行,那么建议大家卸载translucenttb。2、然后更换

如何解决Win11任务栏透明度有一条线条的问题?如何解决Win11任务栏透明度有一条线条的问题?Jan 29, 2024 pm 12:12 PM

很多的win11用户们在系统的时候会将自己的任务栏设置成透明的,不过也有不少的用户们在设置完了以后在任务栏上出现一条黑线,那么这是怎么回事?用户们可以利用第三方软件来进行设置就可以了。下面就让本站来为用户们来仔细的介绍一下win11任务栏透明有一条线条的解决方法吧。win11任务栏透明有一条线条的解决方法方法一:1、根据用户反馈,可以右键translucenttb,打开设置。2、然后将图示选项的margin设置为1就可以解决了。2、然后在其中选择系统默认的主题更换即可解决。

让win7任务栏透明图文教程让win7任务栏透明图文教程Jul 20, 2023 am 09:49 AM

今天,一群用户问为什么他们的电脑在重新安装Windows7系统后没有透明效果。事实上,这是你的电脑没有及时更新显卡驱动,调整Windows7Aero主题造成的。您可以通过以下方式进行设置。1.首先,您需要确保您的计算机安装了一个新的显卡驱动您可以使用驱动精灵或360驱动大师在线更新显卡驱动器。。2.面对桌面空白处,右键,选择个性化并打开。3.在这里找到Aero主题,然后选择。正常情况下应该能看到透明玻璃效果。你明白如何让你的win7任务栏透明图形教程吗?不会的同学,赶紧操作吧。

CSS怎么设置透明CSS怎么设置透明Nov 01, 2023 am 10:00 AM

CSS设置透明的方法有opacity属性、rgba颜色值、background-color属性、使用伪元素等。详细介绍:1、opacity属性,通过设置元素的opacity属性来实现透明效果,该属性的取值范围为0到1,0表示完全透明,1表示完全不透明;2、rgba颜色值,通过设置元素的背景颜色或文字颜色为rgba颜色值来实现透明效果,rgba颜色值由红、绿、蓝和透明度等等。

如何重命名文件夹内所有文件的扩展名,包括子文件夹如何重命名文件夹内所有文件的扩展名,包括子文件夹Apr 14, 2023 pm 12:22 PM

假设您需要将文件的扩展名从一个扩展名重命名为另一个扩展名,例如jpg到png。这很简单,当然!但是,如果您有多个需要更改扩展名的文件怎么办?或者更糟糕的是,如果这些多个文件也位于多个文件夹和子文件夹中,在一个文件夹中怎么办?好吧,对于一个普通人来说,这可能是一场噩梦。但对于一个极客来说,绝对不是。现在的问题是,你是不是极客。好吧,有了 极客专页的帮助,您绝对是!在本文中,我们通过批处理脚本的方法解释了如何轻松地重命名文件夹内所有文件的扩展名,包括您选择的子文件夹从一个扩展名到另一个扩展名。注意:

linux系统怎么设置终端透明?linux系统怎么设置终端透明?Jan 07, 2024 am 10:21 AM

linux在终端中执行命令时,为了难能看到其它的帮助文档,比如pdf、网页等,可以设置终端透明度,该怎么设置呢?下面我们就来看看详细的教程。。一、开启窗口特效1、要给终端设置透明度,需要先开启窗口特效,首先点击任务栏上的”控制中心“。2、在控制中心中单击”显示“。3、在”显示“中保证”开启窗口特效”的按钮是打开的状态。4、另外,也可以使用快捷键shift+win+tab键来快速打开或者关闭窗口特效。二、设置透明

win10任务栏透明怎么设置的步骤教程win10任务栏透明怎么设置的步骤教程Jul 11, 2023 pm 11:37 PM

偶然一次机会看到别人win10任务栏是透明,看着非常美观,回来之后也想给自己win10电脑设置成透明的。正常情况下,默认任务栏不是透明背景,需要大家调整设置一下,接下来,小编详解一分钟让Win10任务栏全透明的设置方法,快来看看吧。1、首先,打开win10系统,然后在桌面上点击鼠标右键,在右键菜单中找到“个性化”2、然后,在“个性化”窗口中选择左侧菜单中的“颜色”点击打开。3、然后,在右边的菜单中找到“透明效果”选择状态为“开”并且勾选“开始菜单、任务栏和操作中心”和“标题栏”。4、然后,回到w

See all articles

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
4 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌

Outils chauds

DVWA

DVWA

Damn Vulnerable Web App (DVWA) est une application Web PHP/MySQL très vulnérable. Ses principaux objectifs sont d'aider les professionnels de la sécurité à tester leurs compétences et leurs outils dans un environnement juridique, d'aider les développeurs Web à mieux comprendre le processus de sécurisation des applications Web et d'aider les enseignants/étudiants à enseigner/apprendre dans un environnement de classe. Application Web sécurité. L'objectif de DVWA est de mettre en pratique certaines des vulnérabilités Web les plus courantes via une interface simple et directe, avec différents degrés de difficulté. Veuillez noter que ce logiciel

PhpStorm version Mac

PhpStorm version Mac

Le dernier (2018.2.1) outil de développement intégré PHP professionnel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

MinGW - GNU minimaliste pour Windows

MinGW - GNU minimaliste pour Windows

Ce projet est en cours de migration vers osdn.net/projects/mingw, vous pouvez continuer à nous suivre là-bas. MinGW : un port Windows natif de GNU Compiler Collection (GCC), des bibliothèques d'importation et des fichiers d'en-tête librement distribuables pour la création d'applications Windows natives ; inclut des extensions du runtime MSVC pour prendre en charge la fonctionnalité C99. Tous les logiciels MinGW peuvent fonctionner sur les plates-formes Windows 64 bits.

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Puissant environnement de développement intégré PHP