css怎么改变button的边框颜色

html-css012

css怎么改变button的边框颜色,第1张

1、新建HTML文件。

2、创建HTML标签和内容。

3、预览效果如图。

4、设置右边框的颜色border-right-color:#30C。

5、预览效果如图。

6、设置右边框的颜色border-right-color:rgb(204,0,102)。

7、预览效果如图。

鼠标经过改变边框颜色可以直接css的:hover伪类，然后定义border样式就是了。如下示例代码：

a{color:#000border:1px solid #000} /* 默认的样式 */

a:hover{border-color:#ccc} /* 鼠标经过时的样式 */

鼠标经过时将边框颜色变为了灰色。

1.CSS用:focus伪类就能实现内部边框的颜色，边框颜色改为了红色。

具体代码如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>百度经验</title>

<style type="text/css">

* {margin: 0padding: 0}

.main {margin: 50px autowidth: 400px}

.inp {

width: 200px

height: 30px

}

.inp:focus {

outline:none

border: 1px solid red

}

</style>

</head>

<body>

<div class="main">

<input type="text" class="inp">

</div>

</body>

</html>

如何改变input点击后的边框颜色