@ css怎样让图片鼠标停留时变亮?
1、打开hbuilder,在空白的html文件上面设置一个div,给div一个class并命名为img。
2、在CSS里设置img的类一定的宽和高,引入示例图片,设置图片为不重复。并且给img的类设置“:hover”伪类,设置伪类内的透明度为0.6。
3、打开浏览器,在浏览器内查看效果。
4、将鼠标移入图片,就会发现图片已经变亮了。
以上就是用CSS设置鼠标经过图片变亮,移开变变暗效果的演示。
@ css如何设置悬浮旋转?
这与html的结构是分不开的
举个例子
html
<div.class=”pic”>鼠标移过来看看<img src=”你找张你本地的图片放这里”/></div>.pic{position:relative;}
.pic img{display:none}
.pic:hover img{display:block}上面的代码,实现了鼠标经过时,图片显示。但ie低版本浏览不支持a以外的元素的hover伪类,所以这个写法是不兼容低版本浏览的。
另外你的要求是
鼠标拿开旋转消失
这个可以在.pic img加css3的过渡属性,在.pic:hover img加css3的旋转属性即可。
@ CSS伪元素有哪些不得了的用法?
先列出CSS中常用的伪类
a:link {color:#FF0000;} /* 未访问的链接 */
a:visited {color:#00FF00;} /* 已访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */
:checked 选择所有选中的表单元素
:disabled 选择所有禁用的表单元素
p:first-child 父元素中第一个p元素
比如#div p:first-child{
color:#E4393c;
}
:last-child 父元素中最后一个p元素
p:before
p:after 这两个常被用来清除浮动