午后・时光

      1
2345678
9101112131415
16171819202122
23242526272829
30      

[复位日记]

最新评论

无缝图片
函数
盒子定位
悄然
小希

网站统计

·今日访问 : 239
·页面点击 : 239
·当前在线 : 13

2024年6月17日 星期一[阅读 133]

<style>
#mydiv { margin: 20px auto; width: 600px; height: 300px; border: 1px solid plum; position: relative; }
#mydiv::before, #mydiv::after { position: absolute; right: 0; width: 100%; height: 100%; }
#mydiv::before { content: 'before'; background: pink; }
#mydiv::after { content: 'after'; background: lightblue; width: 60%; }
#son { position: absolute; bottom: 0; width: 100%; height: 60%; background: olive; }
</style>

<div id="mydiv">
        <div id="son">son</div>
</div>

2024': 前一则  下一则    

评论列表: [ 1 条 ]

1 # 悄然[2024-6-17 20:52]   这个是伪元素层级演示,:after 默认最上,:before最下。其余元素在中间。。。比如#son

发表评论:

       

Copyright © 2014 All Right Reserved 马黑PHP文章管理整站系统v1.8
联系我们: gxblk@163.com