在開發網頁時，我們經常會用到CSS樣式來美化網頁。不過不同的瀏覽器對于CSS的支持程度卻是不一樣的，特別是IE和WebKit兩大瀏覽器之間的支持情況差距較大。下面我們將會深入探討一下它們之間的差異。

首先，對于CSS盒子模型的解析，IE和WebKit有一些細節不同。在IE中，盒子模型的寬度和高度都會包含內邊距(padding)和邊框(border)，而在WebKit中，則是不包括內邊距和邊框的，只有內容區的寬度和高度。如下面的代碼所示：

.box {
width: 200px;
height: 200px;
border: 1px solid #000;
padding: 10px;
box-sizing: border-box;
}

在IE中，這個盒子的實際寬度和高度是222px(200px+2*10px+2*1px)，而在WebKit中，實際寬度和高度是200px。如果我們想讓盒子在兩個瀏覽器中所占據的空間一樣，我們可以使用box-sizing屬性，并將其值設為border-box。這樣，在IE中也可以只計算內容大小了。

除了CSS盒子模型之外，對于CSS3的部分屬性，在IE和WebKit也存在一些不同。以flex布局為例，這是CSS3新引入的一種布局模式，能夠非常靈活地控制盒子的排列方向和大小。不過，在IE中，flex布局卻需要使用-ms-flex屬性，而在WebKit中只需要使用flex屬性即可。如下面的代碼所示：

.box {
display: -ms-flex;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
-ms-align-items: center;
align-items: center;
-ms-justify-content: center;
justify-content: center;
}

上面的代碼中，-ms-flex屬性是為了讓IE支持flex布局所添加的，而在WebKit中只需要使用flex屬性即可。不過在使用flex屬性時，需要注意不同瀏覽器之間對于該屬性的前綴和后綴的支持情況，以免出現布局錯亂的問題。

以上就是IE和WebKit之間CSS部分的差異，如果我們想要讓網頁在不同瀏覽器中呈現一致的效果，就需要注意這些細節問題，并采取相應的解決方案。