CSS中，不同的div可以具有不同的寬度，這取決于開發者想要呈現什么樣的頁面布局。

.div1 {
width: 80%;
}
.div2 {
width: 200px;
}

在上面的代碼中，我們定義了兩個不同的div，一個具有80%的寬度，另一個具有200像素的寬度。

使用百分比定義的寬度對于響應式設計非常有用，它可以讓頁面元素根據屏幕大小自動調整。當頁面寬度小于200像素時，第一個div的寬度將自動縮小，而第二個div將保持不變。

為了避免div重疊或出現意外布局，我們應該始終確定每個div的寬度。

.wrapper {
width: 100%;
}
.left {
float: left;
width: 30%;
}
.right {
float: left;
width: 70%;
}
.clear {
clear: both;
}

在這里，我們定義一個父級容器，稱為wrapper。同時，我們定義了兩個子元素，left和right，并為每個元素設置了不同的寬度。最后，我們添加了一個空div來清除浮動。

這些簡單的CSS代碼可以幫助我們創建復雜而美麗的頁面布局。只要我們掌握了它們，并了解如何使用它們，就可以輕松地創建任何我們想要的布局。