CSS样式消失了,怎么回事?

html-css012

CSS样式消失了,怎么回事?,第1张

按照你的说法,如果消失了,有3种情况

一,设定了display:none你检查下

二,层被挡住了,你看看是否设置了 position:absoluteleft:0right:0之类的

三,float的问题,就是把层给浮上去了。导致你的层会重叠。一般多加一行<br style="clear:both" />解决问题。

希望我的建议对你有用。

使用CSS3中的过渡效果——背景色渐渐消失

这里有个示例,可以看下,谷歌浏览器下有效,IE10也支持,好像低版本的还没这个功能哦。

在IE10获取谷歌浏览器下点击绿色层不放,背景色会渐渐消失。

<!DOCTYPE html>    

<html lang="en-us">    

<head>    

<style type="text/css">    

body {    

 padding:10px    

 font:bold 20pt "Segoe UI"    

}    

div {    

 width:250px    

 background-color:lime    

 padding:10px    

 opacity:1    

 -ms-transition:opacity 5s linear 1s    

 -webkit-transition:opacity 5s linear 1s // This selector ensures compatibility with WebKit-based browsers.    

 -moz-transition:opacity 5s linear 1s // This selector ensures compatibility with Mozilla-based browsers.    

 transition:opacity 5s linear 1s // This selector ensures compatibility with browsers that support non-prefixed transition properties.    

}    

div:active {    

 opacity:0    

}    

</style>    

</head>    

<body>    

<div>    

Duis ac leo sit amet lectus tristique pulvinar nec rutrum dolor. Etiam sed ipsum enim, vitae euismod odio. Suspendisse eu.    

</div>    

<p style="padding:5px font-size: 8pt margin: 5px 0"><a href="

</body>    

</html>

CSS3中的过渡效果——点击图层,颜色渐渐消失

Internet Explorer 10 和使用 JavaScript 的 Modern UI 风格的应用支持 CSS3 过渡特效。通过过渡特效,可以实现简单的动画效果,在一小段时间内平滑地改变CSS 的属性值。例如,在10秒钟内改变一个对象的大小和颜色。以前需要通过 CSS 和 JavaScript 的复杂组合操作实现的效果,现在只需几行 CSS 代码即可完成。

1. <!DOCTYPEhtml>

2. <htmllang="en-us">

3. <head>

4. <styletype="text/css">

5. body {

6. padding:10px

7. font:bold27px "Segoe UI"

8. }

9. div {

10.width:250px

11.background-color:lime

12.padding:10px

13.opacity:1

14.-ms-transition:opacity5s linear 1s

15.}

16.div:active {

17.opacity:0

18.}

19.</style>

20.</head>

21.<body>

22.<div>

23.Duis ac leosit ametlectustristiquepulvinarnecrutrum dolor.

24.Etiamsedipsumenim,vitae euismododio.Suspendisseeu.

25.</div>

26.</body>

27.</html>

复制代码

在这个示例中,属性-ms-transform 被设置为“opacity 5s linear 1s”。借助于:active伪类,当单击(或触摸)并按住柠檬绿色的div,它将慢慢消失。特别地,它的opacity 属性在1 秒之后,会产生平滑的过渡效果(使用一个线性计时函数),在5 秒之内从完全不透明变为完全透明。请参见这个页面(http://go.microsoft.com/fwlink/p/?LinkId=227845)。

1. -ms-transform属性是一个简写属性,这个声明也可以使用以下属性来替代:

2. -ms-transition-property:opacity

3. -ms-transition-duration:5s

4. -ms-transition-timing-function:linear

5. -ms-transition-delay:1s

了解更多,百度[xyytIT]进我博客查看