div里边文字怎么显示在DIV外边

当你想要让div内的文字超出div本身显示出来时，这通常是因为你希望实现溢出文本或者悬挂溢出效果。有几种常见的CSS样式可以实现这个需求：

1. **`white-space: nowrap;`**：当设置`white-space: nowrap;`时，文本不会换行，而是尝试在其容器内继续显示，超出部分会悬挂在容器外部。

.parent-div {
    width: 100px;
    height: 50px;
    overflow: hidden; /* 隐藏超出的部分 */
    white-space: nowrap;
}
.child-text {
    display: inline-block; /* 或者直接使用块级元素，如 div */
}

2. **`text-overflow: ellipsis;`**：配合`overflow: hidden;`使用，如果内容溢出，会显示省略号（...）。

.parent-div {
    width: 100px;
    height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box; /* 对于老版本浏览器，需要加前缀 */
    webkit-line-clamp: 2; /* 设置显示几行，超过则隐藏 */
    line-clamp: 2;
}

3. **`position: relative;` + `position: absolute;`**：通过绝对定位将文字移出父元素，同时保持与原位置的关联。

.parent-div {
    position: relative;
    width: 100px;
    height: 50px;
    overflow: hidden;
}

.child-text {
    position: absolute;
    bottom: 0;
}