※ 引述《laukevin (没回水球麻烦寄信给我^^)》之铭言： : 小弟友一个问题想请教 : 如果我在痞客帮的部落格 : 在侧栏的地方 我有新增自订侧栏 : 我查原始码 我的自订侧栏是"box1661320" : 我想用css呈现一个效果 : 我只想出现图片(xxxxxx) 然後点选图片会有连结 : 请问应该怎麽做 : 小弟在网路上做的功课 是有人说在自订栏位的内容打上 : <a href="打上连结网址"><img src='上传空间取得的图片网址"></a> : 但是小弟可能比较贪心 想要有一种渐变效果 : 就是ccs的 transition 以下有教学者的说明 : http://fundesigner.net/css-transition/ : 问题结论: : 看起来渐变效果是要用css来编 : 所以自订栏未出现图片连结用设定内容来写好像两个错开 对我来说已经混淆 : 而如果是用css在自订栏位区写图片连结 : 第一小弟有点不知道该怎麽写 好像分 li a 和 li a hover : 而且也不知该该写在text或是title : 图片设定是200px 50px : 高手们啊 小弟已经搞了三天估狗好几次 : 就这里最後希望能有人帮帮我 感谢啦 看你的问题，也许可以认为是想要让图片缓缓出现，然後有连结 首先，图片嵌连结只能在HTML完成，CSS这东西只是增加样式，无关网页内容 所以在侧栏中填上你上面打的形式就对了 另外，渐变效果因为没有用伪类，直接用transition应该是没效果的 这时候应该配合keyframe用animation 如果只是要在载入网页时让图片慢慢出来，可以用下面的CSS语法 #box1661320 .box-text img{ -moz-animation-name:fadeIn; -moz-animation-duration:0.7s; -moz-animation-timing-function:ease-in; -webkit-animation-name:fadeIn; -webkit-animation-duration:0.7s; -webkit-animation-timing-function:ease-in; -o-animation-name:fadeIn; -o-animation-duration:0.7s; -o-animation-timing-function:ease-in; animation-name:fadeIn; animation-duration:0.7s; animation-timing-function:ease-in; } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } 要改渐变时间的话，变更animation-duration的值就行了 如果不符合你要的效果，请指正 -- 予岂好辩哉？予不得已也。 --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 61.62.77.240