求CSS代码,输入字时输入框边框闪烁

html-css020

求CSS代码,输入字时输入框边框闪烁,第1张

<style>

#oText{border:1px?dotted?#ff0000ryo:expression(?light?(){with(documen

t.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#f

fee00")timer=setTimeout(light,500)}},(){this.style.borderColor="#ff0000

"clearTimeout(timer)})}

</style>

<input?type="text"?id="oText">

需要准备的材料分别有:电脑、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页面,此时文字实现了闪烁的效果。

left:100px去掉就好了,可以用float之类的做,然后width里面加一点宽度,float:left 或者right一般就能定位了。

用类似mouseover 的也能做。类似下面这种,希望对你有启发。

<a href="#" target="_blank" title="">

    <img src="1.jpg"

         onmouseover="this.src='2.jpg'"

         onmouseout="this.src='3.jpg'">

    </img>

</a>