如何改變子div的寬度，使其位于父div中？

它應該在填充的內部。在這種情況下，頂部和左側都可以，但右側不合適。

https://jsbin.com/tuhohuvoxa/edit? html，css，輸出

.parent {
  padding: 20px;
  border: 0.1em solid;
  height: 200px;
}

.child {
  position: absolute;
  border: 0.1em solid;
  height: 10px;
  width: 100%;
}

如果不需要子級是絕對的，只需從。子類將使寬度與父類匹配，而不會溢出。

如果你真的需要。子類是絕對的，您可以更新。孩子和。父類如下:

.parent {
  padding: 20px;
  border: 0.1em solid;
  height: 200px;
  position: relative;
}

.child {
    position: absolute;
    border: 0.1em solid;
    height: 10px;
    left: 0;
    right: 0;
    margin-left: 20px;
    margin-right: 20px;
}

在父對象上設置position:relative將確保子對象相對于父對象。將left和right設置為0將確保子元素匹配父元素的寬度，添加margin-left和margin-right將確保子元素從父元素插入。

*{
        margin: 0;
        padding: 0;
    }
    .parent {
        border: 0.1em solid;
        height: 100px;
        width: 100px;
        position: relative;
    }

    .child {
        position: absolute;
        border: 0.1em solid;
        height: 20px;
        width: 20px;
        top: 0px;
        left: 0px;
    }

<div class='parent'></div>
<div class='child'></div>

您只需要將這個位置添加到父元素和子元素中:

.parent {
  position: relative;
}

.child {
  left: 0;
}

那么擁有絕對位置的孩子會適應父母。