CSS入门(5)-CSS+DIV
2015-11-27 08:20
627 查看
1. 实现鼠标经过背景变色
方法一
#div:hover{background:#000000;}
解释:鼠标经过id为div的元素时背景变色
方法二
<div onmouseover="this.style.backgroundColor='#F4F9FD'" onmouseout="this.style.backgroundColor='#FFFFFF'">这里只是测试</div>
方法三:
<style> .d_over{background-color:#307172;} .d_out{background-color:#EFEFEF;} </style> <div class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'">哈哈哈哈哈</div> ``` `<a>`的标签是可以,可是,这样子会导致其它带有`<a>`标签的也跟着变色。 一般`<a>`是用来定义链接的样式的,并不是定义某个区域的。现在常用的div+css的网页用,div就是表示区域的意思,还是喜欢用这种,当然用table的话,会有更简单的方法。 其实现在用的较多的是用<a>标签实现的。 ```css <style> a {color:red; width:100px; height:22px; line-height:22px;} a:hover {background:#f4f4f4; color:#000;} </style>
这样只要是代连接的都会变哦,你可以在某区域用,则某区域里面的所有来连接的都会鼠标经过变色。
相关文章推荐
- Web布局连载——两栏固定布局(五)
- [div+css]晒晒最新制作专题推广页模板
- 设计更快的网页(三):字体和 CSS 调整
- 纯CSS制作的新闻网站中的文章列表
- 10条影响CSS渲染速度的写法与使用建议第1/3页
- BS项目中的CSS架构_仅加载自己需要的CSS
- 很不错的 CSS Hack 又学了一招
- 发一个css比较清爽的写法
- CSS expression控制图片自动缩放效果代码[兼容 IE,Firefox]
- css布局网页水平居中常用方法
- CSS经典技巧十则第1/2页
- css 兼容性问题this.style.cursor=''hand''
- IE6不能正常解析CSS文件问题的解决方法及原因分析
- 欲练CSS ,必先解决IE的一些细节分析
- CSS文字截取功能实现代码
- 支持IE6 IE7 Firefox 的纯CSS的下拉菜单
- 不同版本IE使用不同css(css条件注释语句用法)
- css类选择器的使用方法详解
- css文本框与按钮美化效果代码
- 解决ie动态修改link样式,import css不刷新的问题