最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
css div网页折叠层
时间:2022-06-25 10:18:00 编辑:袖梨 来源:一聚教程网
| 代码如下 | 复制代码 |
|
.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的不同组合,可以实现三角形的不同的朝向,你可以举一反三制作你的折叠效果了
下面看效果
| 代码如下 | 复制代码 |
|
我的标题 |
|
相关文章
- 大道仙途手游内府系统详解 大道仙途手游内府功能、开启条件与培养策略 03-28
- 微博网页版登录手机端-微博网页版手机登录入口 03-28
- 洛克王国世界公测开服时间 洛克王国世界上线日期与预约详情 03-28
- 抖音放映厅入口在哪-抖音放映厅如何搜电影 03-28
- 洛克王国世界呱呱 洛克王国人气宠物呱呱角色设定与获取方式详解 03-28
- 如龙厂商新作曝光超大规模设定 横跨日本五个时代 03-28
