最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
css div网页折叠层
时间:2010-08-25 编辑:简简单单 来源:一聚教程网
代码如下 | 复制代码 |
.arrow {
|
这其中关键的属性是border-left 和 border-top,这两个属性形成了一个三角形效果,也就是带子的拐角效果,你可以将以上代码的5、6行,做如下更改,看看效果:
1
2
代码如下 | 复制代码 |
border-right: 20px solid transparent; border-top: 10px solid #c8c8c8; |
再做一次更改,看看什么效果:
1
2
代码如下 | 复制代码 |
border-left: 20px solid transparent; border-bottom: 10px solid #c8c8c8; |
通过这几次更改,你可以看到,border-right、border-left和border-bottom、border-top的不同组合,可以实现三角形的不同的朝向,你可以举一反三制作你的折叠效果了
下面看效果
代码如下 | 复制代码 |
我的标题 |
-
上一个: 三款css横向二级菜单效果代码
-
下一个: CSS图片等比例缩放代码
相关文章
- CSS网页渲染效率怎么提高 03-29
- css网页布局用Margin还是用Padding 08-06
- 详解网页CSS代码挂马过程 07-11
- 让您头痛的DIV+CSS网页错位诊断及解决办法 01-05
- div+css网页布局中下划线text-decoration使用教程 01-05
- DIV+CSS网页模板开发初始化CSS的好处 01-04