css 文本框聚焦时如何控制无边框

html-css010

css 文本框聚焦时如何控制无边框,第1张

具体实现代码如下:

var inputO = document.getElementById("input1")

inputO.onblur = function()

{

inputO.style.border = "1px solid rgb(0, 0, 0)"//input失去焦点时的边框状态

}

inputO.onfocus = function()

{

inputO.style.border = 0//input得到焦点时的边框状态

}

使用CSS实现鼠标点击元素后向该元素添加样式,首先需要理解这个点击事件,通过单独的css或者是html是无法实现的,一般都需要结合Js来做,需要获取到这个元素,然后在通过js来改变元素的样式,在html中需要添加一个点击事件,也就是onclick,然后就是可以来实现,具体看下代码:

<html>

<head>

<style>

#round{

width:300px

height:200px

}

</style>

</head>

<script>

function iLeft(){

var oDiv = document.getElementById('round')

oDiv.style.left = 400+'px' //通过js改变这个div的left值

}

</script>

<body>

<div id='round'>

<p><a href='' onclick="iLeft()" >我是测试文字</a></p>

</div>

</body>

</html>