html - 相对于框的文本对齐方式

Question

我想根据文本所在的框对齐文本。看下面的html代码。

Html:
<div class="box">
    <div class="cont">
        Hello World!!!
    </div>
</div>

现在这是它的css代码

CSS:
.box
{
    height:200px;
    width:200px;
    border:1px dashed red;
}
.cont
{
    border:1px solid green;
    position:fixed;
    right:0px;
    width:55px;
}

但是当我保持它固定时，它只会移动到页面的右上角，而我希望它移动到框的角落。提前致谢。

Answer 1

如果要根据父元素定位内容，请使用 position: absolute。要表示您希望它根据哪个父元素定位，请给父元素一个 position:relative 样式。从 cont 中删除 position:fixed 并添加以下内容，它应该可以工作。

.box {
position: relative;
}

.cont {
position: absolute;
}