CSS超出部分取反，也稱為負margin。在頁面排版時，有時希望讓某個元素超出其父元素的邊框，例如創建一個具有招牌效果的列表項。這時就可以使用負margin。

要想理解負margin的原理，首先需要了解元素的盒模型。一個元素的盒模型由四個部分組成：內容區域、內邊距、邊框和外邊距。其中邊框和外邊距屬于盒子的外部，因此它們可以超出盒子。

.box {
width: 200px;
height: 200px;
border: 1px solid black;
margin: 50px;
}

以上代碼定義了一個200x200像素大小的盒子，邊框為1像素實線黑色。外邊距為50像素，因此整個盒子占據了300x300像素的空間。

如果需要讓盒子的內容相對于其父元素左移50像素，可以給盒子的左外邊距設置為負值：

.box {
width: 200px;
height: 200px;
border: 1px solid black;
margin: 50px;
margin-left: -50px;
}

此時盒子的左邊框將會是頁面左邊緣，而盒子的內容區域則會左移50像素。

負margin也可以應用到其他方向：

.box {
width: 200px;
height: 200px;
border: 1px solid black;
margin: 50px;
margin-top: -50px;
}

以上代碼將盒子的上外邊距設置為-50像素，使得盒子的上邊框超出了父元素的頂部。

需要注意的是，負margin可能會對頁面布局造成混亂。某些情況下，它可能會使元素被遮擋或嵌套后出現問題。因此，必須確保對負margin使用得當，避免破壞整個布局。