部署Web应用程序时出现问题。 [英] Problem in deploying web application.
问题描述
我开发了一个简单的CSS图像滑块，但它给我一个问题。
这个CSS在mozilla firefox中工作得很好，但是当我在Internet Explorer上运行相同的页面时给我提问。一切都搞砸了。
以下是我的代码：
样式表代码是如下：
body {
text-align ： center;
}
＃ images {
width ： 500px;
height ： 250px;
溢出 ： 隐藏;
position ： relative;
margin ： 20px auto;
}
＃ images img {
width ： 500px;
height ： 250px;
position ： 绝对;
top ： 0;
left ： -500px;
z-index ： 1;
opacity ： 0;
过渡 ： 所有线性500毫秒;
- o-transition ： 全部线性500毫秒;
- moz-transition ： 所有线性500毫秒;
- webkit-transition ： < span class =code-keyword>所有线性500毫秒;
}
＃ images img：target {
left ： 0;
z-index ： 9;
opacity ： 1;
}
＃ images img：first-child {
left ： 0;
opacity ： 1;
}
＃ slider a {
text-decoration ： 无;
背景 ： ＃11ED44;
border ： 1px solid＃00000;
padding ： 4px 6px;
color ： ＃222;
}
＃滑块 a：悬停 {
背景 ： ＃CC3B2B;
test.html页码：
< html>
< head>
< link rel =stylesheethref = test.csstype =text / css/>
< / head>
< body>
< img id =image1src =01.jpg/>
< img id =image2src =02.jpg/>
< img id =image3src =03.jpg/>
< img id =image4src =04.jpg/>
< / body>
< / html>
据我所读过， Internet Explorer不支持transition属性。请参阅
[此处
Hi,
I had developed a simple CSS image slider, but its giving me a problem.
this CSS is working fine in mozilla firefox but give me problem when i run the same page on internet explorer. everything get messed up.
below is my code:
style sheet code is as follows:
body {
text-align: center;
}
#images {
width: 500px;
height: 250px;
overflow: hidden;
position: relative;
margin: 20px auto;
}
#images img {
width: 500px;
height: 250px;
position: absolute;
top: 0;
left: -500px;
z-index: 1;
opacity: 0;
transition: all linear 500ms;
-o-transition: all linear 500ms;
-moz-transition: all linear 500ms;
-webkit-transition: all linear 500ms;
}
#images img:target {
left: 0;
z-index: 9;
opacity: 1;
}
#images img:first-child {
left: 0;
opacity: 1;
}
#slider a {
text-decoration: none;
background: #11ED44;
border: 1px solid #00000;
padding: 4px 6px;
color: #222;
}
#slider a:hover {
background: #CC3B2B;
test.html page code:
<html>
<head>
<link rel="stylesheet" href="test.css" type="text/css" />
</head>
<body>
<img id="image1" src="01.jpg" />
<img id="image2" src="02.jpg" />
<img id="image3" src="03.jpg" />
<img id="image4" src="04.jpg" />
</body>
</html>
According to all I have read, Internet Explorer does not support the transition property. See
[Here]
这篇关于部署Web应用程序时出现问题。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
