摘要:
li因为本身自带1个像素的边框,当鼠标悬停改变它的颜色时就会出现抖动的问题,此时只需把li的边框颜色设置为透明即可 li { width: 199px; height: 235px; border: 1px solid transparent; } li:hover { border: 1px so 阅读全文
摘要:
li{transition: all .2s linear;} li:hover { z-index: 2; -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, .1); box-shadow: 0 15px 30px rgba(0, 0, 0, .1); - 阅读全文
摘要:
主要是中间的分割线,效果图如下: Html代码: <div class="fuwu"> <ul> <li><a href=""><i class="iconfont icon-shizhong"></i><span>保障服务</span></a></li> <li><a href=""><i cla 阅读全文
摘要:
一般适用于公告展示。 操作步骤: 1,强制性让内容不换行只在一行内显示 white-space: nowrap 2,把div这行内溢出的部分文字隐藏 overflow:hidden 3,再把div内显示不全的的文字用省略号替代 text-overflow:ellipsis 阅读全文
摘要:
主要原理: 1,先把盒子宽度和高度设置为0,只剩下边框,这样的话每个边框都会变成1个三角形 2,需要三角形朝向哪个方向,先把所有边框颜色设置为透明,然后只需设置这个方向的边框颜色就可以了(箭头方向和边框方向相反,比如需要箭头朝右就需要设置左边框颜色) width: 0px; height: 0px; 阅读全文
摘要:
<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title></title></head> <style>.a {color : #FFFF00;} .a:hover + .b{color : #00FF00;}.a:hover 阅读全文
摘要:
使用方法:.父元素:hover .子元素(hover和子元素之间需要一个空格),如: .a:hover .b 演示效果:代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> .alarm:ho 阅读全文
摘要:
使用场景: 比如在视频缩略图上显示播放按钮 只需在背景图属性上设置个center值即可。 background: url(../images/play.jpg) no-repeat center; 阅读全文
摘要:
1,元素为浮动时(float) 2,元素被设置为绝对定位时(absolute) 3,元素被设置为固定定位时(fixed) 4,元素的display属性为设置为none隐藏时(display:none) 阅读全文
摘要:
iconfont使用说明: 1,下载对应的字体包 2,解压得到iconfont.css,在网页文件中引入iconfont.css 3,使用<i class="iconfont icon-sousuo"></i>显示字体,其中iconfont是固定类目, icon-sousuo是字体css名 阅读全文