html中伪类的兼容性,css,ie8兼容性_CSS 伪类在IE8中样式无法生效，css,ie8兼容性,伪类 - phpStudy...

CSS 伪类在IE8中样式无法生效

写了一个纯CSS的竖版流程样式，效果如下

1. 起始
2. 1
3. 2
4. 结束

使用：before生成左侧圆，首尾两头的li用：after生成竖条，其余都用border-left填补。

伪类绝对定位，首尾li ：before做了位置微调。

但在IE8中出现了首尾li的:before失效情况(中间li则正常)

几次调整css不见成效.....css代码，比较丑....

.case-state>li{

position: relative;

display: block;

height: 40px;

line-height: 40px;

color: #b4e7bf;

font-size: 14px;

padding-left: 10px;

border-left: 5px solid #82d694;

}

.case-state>li:before

{

content: "";

position: absolute;

left: -7px;

top: 16px;

width: 9px;

height: 9px;

border-radius: 50%;

color: #82d694;

border: 2px solid #fff;

z-index: 2;

}

.case-state>li:first-child:before,

.case-state .ing:before,

.case-state .end:before

{

left: -2px;

}

.case-state>li:first-child:after{

content: "";

position: absolute;

left: 0;

top: 5px;

height: 35px;

width: 5px;

border-top-left-radius: 3px;

border-top-right-radius: 3px;

background: #82d694;

}

.case-state .ing,

.case-state>li:first-child,

.case-state .end{

border: 0;

padding-left: 15px;

}

.case-state .ing:after{

content: "";

position: absolute;

left: 0;

top: 0;

height: 35px;

width: 5px;

border-bottom-left-radius: 3px;

border-bottom-right-radius: 3px;

background: #82d694;

}

.case-state .end:after{

content: "";

position: absolute;

left: 0;

top: 0;

width: 5px;

height: 23px;

background: #82d694;

}

.case-detail table{

font-size: 22px;

line-height: 50px;

color: #506173;

}

.case-detail tr>td:first-child{

font-size: 18px;

color: #8c9cad;

}

.case-detail .tr-top td:first-child {

padding-top: 5px;

}

相关阅读:

是不是没法爬去qq群名称人数等信息？

python处理中文

Android-Studio 新建项目 Missing styles

Web 移动端 你们在开发移动页面的时候使用的默认字体是？欢迎小伙伴到此一游！

mac下使用supervisor的section setting问题

php取出数据库数据后,var_dump()，id字段为什么是字符串类型？

关于LNMP性能问题

如何将下面的注释改成yml?

求助Tornado/Cyclone RBAC 修饰符编写

开始学angularJs,每次都报错，有时候写的两个大括号也会直接在网页上显示

这个小动画怎么搞才能达到目的

什么原因才会导致 fs.readFile 不执行回调函数

轻量级前端框架,可以快速上手,有没有推荐?

python 'module' object has no attribute 'PROTOCOL_SSLv2'

对象不支持“ready”属性或方法

path.resolve(__dirname, 'src') 和 __dirname + 'src' 有什么区别？

PHP比较mysql里的Int数据

a tag download 属性制定下载文件名字的问题

Struts2下载浏览器没响应，求指教解决问题思路

wxPython怎么控制只能运行一个实例程序？