教学 blockquote hover ( 小图片 )
11 December 2011 @ 10:10 AM
转帖请留言和附上链接 ♥
这个呢 就是当鼠标指向 blockquote 的时候
Blockquote 的角落会出现小图片的效果 (:
给 还没 放入 blockquote hover 代码的 :
1 Design - Edit html
2 用 ctrl+F 找 :
]]></b:skin>
3 在它 上面 放入 :
blockquote:hover {
border: 2px dashed #000000;
background: url(小图片网址) no-repeat;
background-position: bottom right;
}
给 已经 放入 blockquote hover 代码的 :
1 Design - Edit html
2 用 ctrl+F 找 :
blockquote hover {
3 在它 下面 放入 :
background: url(小图片网址) no-repeat;
background-position: bottom right;
小解释 :
黄色的 是框框的粗细度 种类 和颜色
红色的 是小图片的URL
蓝色的 是小图片的位置 上或下
紫色的 是小图片的位置 左或右
如果你要它慢慢产生变化 而不是立刻有变化
那你就加入这个代码 :
-webkit-transition-duration: 1s;
红色的 是变化的时间 ( 用秒计算的 )
如果你要用这个效果的话
请你们先把你们 blockquote 和 blockquote hover 中的
background: #FFFFFF
或者是 :
background: url(图片url);
删除掉
不然是不会看到效果的 (:
不明白的话可以留下评论问我
或者是在 Tagboard 那里留言给我哦 (:
Copyrighted by Ahhxuan. ♥