现在的位置: 首页 > 综合 > 正文

css border制作三角形、圆角框等的使用

2018年01月29日 ⁄ 综合 ⁄ 共 3663字 ⁄ 字号 评论关闭

- 透明:
IE6浏览器不支持transparent透明属性,就border生成三角技术而言,直接设置对应的透明边框的border-style属性为
dotted或是dashed即可解决这一问题,原因是在IE6下,
点线与虚线均以边框宽度为基准,点线长度必须是其宽度的3倍以上(height>=border-width*3),虚线宽长度必须是其宽度的5倍
以上(height>=border-width*5),否则点线和虚线都不会出现。

- IE6的奇偶bug: 如果定位外框高度或是宽度为奇数,则IE6下,绝对定位元素的低定位和右定位会有1像素的误差。所以,尽量保证外框的高度或宽度为偶数值。

- IE6的空div莫名高度bug: IE6下,空div会有莫名的高度,也就是说height:0;不顶用,此时形成的尖角的实际占高于其他浏览器是有差异的。可使用font-size:0; overflow:hidden;修复此问题。

 

下面为一些border属性的应用:

截图:

 

 


 Demo如下:

Html代码
【上篇】
【下篇】

抱歉!评论已关闭.