父元素设置relative 子元素(按钮)设置absolute 为什么子元素不在父元素中呢？

这是代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            * {
                margin: 0;
                padding: 0;
            }

            .lunbo {
                position: relative;
                width: 520px;
                height: 280px;
                background-color: pink;
                margin: 100px auto;
            }

            .lunbo img {
                width: 520px;
                height: 280px;
            }

            .anniu {
                position: absolute;
                top: 50%;
                margin-top: -15px;
                width: 20px;
                height: 30px;
                background: rgba(0, 0, 0, .3);
                text-align: center;
                line-height: 30px;
                color: #fff;
                text-decoration: none;
                border-top-right-radius: 50%;
                border-bottom-right-radius: 50%;
            }
        </style>
    </head>
    <body>
        <div class="lunbo">
            <img src="img/Z.jpg">
            <a href="#" class="anniu">&lt;</a>
        </div>
    </body>
</html>

 

这个样式要继承，没有继承就跟上面的没有关系了吧。lunbo.anniu{}这样写试试

position需要设置上/下，左/右，你只设置了top，没有设置左/右，可以设置right：0

您好，我是有问必答小助手，你的问题已经有小伙伴为您解答了问题，您看下是否解决了您的问题，可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

ps:问答VIP仅需29元，即可享受5次/月 有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632