需要准备的材料分别有:电脑、chrome浏览器、html编辑器。
1、首先,打开html编辑器,新建html文件,例如:index.html。
2、在index.html中的<style>标签中,输入css代码:
@keyframes blink{
0%{opacity: 1}
100%{opacity: 0}
}
@-webkit-keyframes blink {
0% { opacity: 1}
100% { opacity: 0}
}
.blink{
color: #dd4814
animation: blink 1s linear infinite
-webkit-animation: blink 1s linear infinite
}
3、浏览器运行index.html页面,此时文字实现了闪烁的效果。
#header-login{ /*顶部登陆条*/width:1000px
height:18px
background:url(image/header-login-bg.gif) repeat-x top left}
看上边的代码,主要有两点,1.最好把那张背景图直接放在同一目录的images下,这样子必免浏览器走弯路找你的图片路径,2.top和left.在写的时候最好还是加上。最后你有一句是重复删掉
忘了说一句不知道你的背景图片多大,越小越好!
这个问题就不是CSS的问题了,我觉的是你的页面加载的东西太多了,而且肯定有由先择行的,导致页面,先执行了由先执行的。这种问题只能用排除,从最有可能的地方一点点的试。不过你可以,先把所有的东西移除,只保留你想要的,看看什么结果