怎样用css实现div选中的效果

html-css030

怎样用css实现div选中的效果,第1张

不懂这儿的选中是鼠标点击还是覆盖或者是点击之后的效果,因此就都说一下:

1.被点击时的效果可以用div:active{

css

}

2.鼠标覆盖在上面的时候可以用div：hover{

css}

3.点击之后的效果，这个相对前2种有些麻烦，必须用到JS或者jquery，步骤如下：

a.先给div添加一个选中的样式比如on{css}；

b.然后在js中$('div').click(function{

$('div').toggleClass('

','on')

})

这是jquery自带的一个方法，点击div切换2个class,

1、首先打开Vscode编辑器，新建一个HTML文档，用于承载表格和CSS。

2、然后新建一个5行3列的<table>表格备用。

3、接着定义一个内联样式，设置table表格的偶数行even背景色为浅灰色，奇数行odd的背景色为蓝色。

4、保存以上内容，在浏览器预览效果，就能看到奇数行景色为蓝色，偶数行背景色为浅灰色的效果了。