资讯专栏INFORMATION COLUMN

ie百分比的圆

tuniutech / 1866人阅读

摘要:这个的思路,我一开始以为用画个圆加上超出隐藏,就宽度和一样,高度就是获取百分比的高度的值,但是我的圆兼容是用了这个文件去兼容的。


其实一开始我是做成这样的,直接先用ul定义一个灰色的园,然后用jq获取里面的百分比的值,把值*3.6取整,然后循环一遍每一个值画一条旋转的直线。




    
    




    

但是这个ie上会让浏览器变得比较卡而已也不兼容。
然后我就把ie的样式改成

而除ie以外的浏览器还是没变。
这个的思路,我一开始以为用ul画个圆加上超出隐藏,li就宽度和ul一样,高度就是获取百分比*ul的高度的值,但是我IE的圆兼容是用了ie-css.htc这个文件去兼容的。虽然在ie上ul显示是一个圆,但是ul其实实际上还是一个矩形,所以超出隐藏就得li也所会显示为一个矩形,并不能像我想象那样li变成上图那样。
然后我就想能不能以li获取的值来做显示隐藏,而在里面加个span来显示圆。




    
    




    

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/112022.html

相关文章

  • ie分比的圆

    摘要:这个的思路,我一开始以为用画个圆加上超出隐藏,就宽度和一样,高度就是获取百分比的高度的值,但是我的圆兼容是用了这个文件去兼容的。 showImg(https://segmentfault.com/img/bVN32A?w=296&h=116);其实一开始我是做成这样的,直接先用ul定义一个灰色的园,然后用jq获取里面的百分比的值,把值*3.6取整,然后循环一遍每一个值画一条旋转的直线。...

    zhiwei 评论0 收藏0
  • CSS单位【记录】

    摘要:长度角度时间分辨率颜色函数生成内容图像数字长度数字和单位之间没有空格,之后的长度单位是可选的相对长度单位相对于字体大小相对于小写字母的高度,对于很多字体,相对于数字的宽度相对于根元素字体大小相对于视口的宽度,视口宽度的相对于视口的高度,视  1、长度 2、角度 3、时间 4、分辨率 5、颜色 6、函数 7、生成内容 8、图像 9、数字   1、长度 :数字和单位之间没有空格,0之后的长度单位...

    lushan 评论0 收藏0
  • CSS border属性--妙用

    摘要:在下实现圆角效果由于兼容性特别差,所以要在低版本浏览器下实现圆周角效果特别难利用的效果可实现如下图所示的圆效果代码简单如下制作三杠效果其实就是利用特性变色我们在做如下图标时,一般情况下时会有三处变色但是利用继承自这一特性 在ie下实现圆角效果 (由于border-radius兼容性特别差,所以要在ie低版本浏览器下实现圆周角效果特别难)利用border-style的dotted效果可实...

    heartFollower 评论0 收藏0
  • CSS3 border-radius 圆角

    摘要:但是深入一下,还是很有讲究的。问题,宽高皆为,,这个是怎么工作的换成,,甚至会有什么反应答等于一个的正方形,然后用半径为的圆来过渡边角,如果要在大脑中有动态的效果的话,不妨如下图来理解,更加方便。圆角border-radius,其css如下 IE9+支持(就是ie6,ie7,ie8都不支持),默认值是0,不继承,可以像下面那样设置4个角的值,也可以单独设置,如 border-top-left...

    geekzhou 评论0 收藏0
  • CSS通用数据类型

    摘要:相反的,通用数据类型并不和任何特定的属性相关联。本文,我将整体讲述一下所有的通用数据类型。这样以来就能够避免和字符串数据类型混淆。距离距离数据类型表示距离的单位,有两种长度单位。渐变函数使用数据类型来定义。 CSS中属性的值有着许多种格式。为了让用户代理(即浏览器)能够识别一个值是否有效,则需要确认该值是否符合该类值支持的格式的其中一种。这些属性值所支持的格式叫做数据类型,在规范中用的...

    Elle 评论0 收藏0

发表评论

0条评论

tuniutech

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<