问答详情
源自:4-5 样式布局-发布窗口布局(下)

为啥我这里不需要创建box伪类呢?

<view class="create_content">
    <view class="create_content_box">
        <view class="content_input">
        <input type="text" value="content"  placeholder="请输入内容" />
        </view>
        <view class="content_button">创建</view>
    </view>
</view>
.create_content{		
    position:fixed;/*定位到最下方*/		
    bottom: 95px;		
    left: 15px;		
    right: 15px;		
    border-radius: 50px;		
    box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.2);/*阴影  inset 是内阴影*/	
}	
.create_content:after{		
    /*实现小箭头*/		
    content: '';		
    position: absolute;		
    left: 0;		
    right: 0;		
    margin: 0 auto;		
    bottom: -15px;		
    width: 30px;		
    height: 30px;		
    background:#FAECD8;		
    transform: rotate(45deg);/*旋转*/		
    box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.2);/*阴影  inset 是内阴影*/		
    z-index: -1;/*图层显示到下面一些*/	
}	
.create_content_box{		
    position: relative;		
    display: flex;		
    padding: 0 15px;		
    padding-right: 0;		
    border-radius: 50px;		
    background-color: #FAECD8;		
    z-index: 2;/*图层显示到上面一些*/	
}


提问者:qq_慕仔4201188 2020-11-03 12:17

个回答

  • 清风流逝7309210
    2021-04-26 19:10:39

    跟你box-shadow的写法有关

    5个参数: x偏移量  y偏移量  阴影模糊半径  阴影扩展  阴影颜色, 你第1,2个都是正偏移