在CSS中，折疊原理是指在渲染時合并相鄰的垂直邊距并僅保留最大的邊距值。這是由CSS規范所定義的，旨在簡化文檔的渲染，并更容易理解垂直邊距的計算。

我們可以使用如下代碼來演示折疊原理：

<div style="border:1px solid black;margin-top:20px;padding:5px">
<p style="margin-top:20px">這是一段文字</p>
</div>

在這個例子中，div的上外邊距是20px，p元素的上外邊距也是20px。但是，由于折疊原理，最終的渲染結果只有20px的上外邊距。

需要注意的是，折疊原理只適用于垂直邊距。如果存在水平邊距，則不會觸發折疊原理。另外，當一個元素的上外邊距和下外邊距相鄰時，也會觸發折疊原理。

雖然折疊原理可以簡化文檔的渲染，但是它也可能導致一些不可預期的問題。因此，在編寫CSS時，我們需要時刻了解折疊原理的作用，并針對不同的情況做出相應的調整。