CSS3提供了一種新的生成斜線的方式，可用于裝飾元素邊框或背景。然而，不同瀏覽器對斜線的渲染方式不同，因此需要考慮兼容性。

/* 基本的斜線樣式 */
#element {
border-width: 0 100px 100px 0;
border-style: solid;
border-color: #000;
width: 0;
height: 0;
}
/* 兼容性寫法，添加瀏覽器前綴 */
#element {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

上述代碼利用border-width屬性來生成斜線，其中0 100px 100px 0分別對應上右下左四條邊。而transform屬性則用來進行旋轉，從而讓斜線顯示在正確的角度。

為了保證兼容性，我們需要添加瀏覽器前綴。例如，-webkit-和-moz-對應的是Webkit和Mozilla瀏覽器，-ms-對應的是微軟瀏覽器，-o-對應的是Opera瀏覽器。添加完前綴后，不同瀏覽器就能正確地顯示斜線了。

需要注意的是，斜線的寬度和高度需要根據具體情況調整，以保證斜線效果最佳。