hover与图形变色

来源:3-1 3. border-color与color

龙晓秀

2016-11-16 12:50

老师 你好! 十字图形里面的十字是用伪类生成了 能不能麻烦贴下完整代码 非常感谢 自己做了一上午没做出来 

写回答 关注

2回答

  • 沧伤微夏弃流年
    2016-11-17 14:00:36
    已采纳

    不一样,before是在元素之前插入,after是在元素之后插入

    龙晓秀

    好的 我去看下 非常感谢 回答!

    2016-11-17 14:06:48

    共 1 条回复 >

  • 沧伤微夏弃流年
    2016-11-16 15:52:48
    .add{ color:#ccc; transition:color .25s; border:2px dashed; padding:40px; text-align:center;display:inline-block; position:relative}
    .add:before{ border-top:8px solid; content:""; width:60px; display:inline-block; position:absolute; left:10px; top:36px;}
    .add:after{ border-left:8px solid; content:""; height:60px;display:inline-block;position:absolute; left:36px; top:10px;}
    .add:hover{color:#09F;}

    不太简洁,请参考,要是能优化告诉我哦~~~

    龙晓秀 回复Qzhor

    是的 肯定的呀 呵呵 一个前 一个后 然后用绝对定位去组成十字

    2016-11-17 17:34:34

    共 9 条回复 >

CSS深入理解之border

深入讲解border使用方法及应用,以及如何借助border完成布局

56800 学习 · 73 问题

查看课程

相似问题