在CSS中創建矩形三角形可以通過偽元素來實現。其中最常用的是使用border屬性，以下是一個使用border屬性創建矩形三角形的示例：

.triangle{
width: 0;
height: 0;
border-top: 50px solid transparent; /*上下兩邊不需要線段*/
border-bottom: 50px solid transparent;
border-left: 100px solid red; /*左邊是紅色*/
}

上述代碼的思路是，創建一個寬度為0高度為0的div，然后定義左邊的border為紅色，上下兩邊不需要線段。

接下來是使用偽元素before和after來創造矩形三角形的代碼：

.triangle2{
position:relative;
width: 100px;
height: 100px;
border: 2px solid black;
}
.triangle2:before{
content:'';
position:absolute;
top:100%; /*triangle的起點*/
left:0;
border: 50px solid transparent;/*上下兩邊不需要線段*/
border-right:50px solid blue;
}
.triangle2:after{
content:'';
position:absolute;
top:0;
left:100%;
border: 50px solid transparent;/*上下兩邊不需要線段*/
border-left:50px solid green;
}

上述代碼中，創建一個寬度高度為100px的div，然后使用偽元素before和after來分別創建矩形和三角形。使用position屬性，分別將before和after定位到div的左下和右上角。內容是一個空白，不會顯示出來。

矩形三角形的創造可以擴展到3D空間中。下面是一個在三維空間中創造矩形三角形的示例：

.triangle3{
position:relative;
width: 120px;
height: 120px;
border: 2px solid black;
transform-style:preserve-3d;
transform:rotateX(-30deg);
}
.triangle3:before{
content:'';
position:absolute;
top:100%;
left:0;
border: 60px solid transparent;
border-right:60px solid blue;
transform:rotateY(-90deg) rotateZ(45deg) translateY(-60px);
}
.triangle3:after{
content:'';
position:absolute;
top:0;
left:100%;
border: 60px solid transparent;
border-left:60px solid green;
transform:rotateY(90deg) rotateZ(45deg) translateY(-60px);
}

上述代碼中，將三角形在x軸上旋轉了30度，使其看起來向前傾斜。使用transform-style:preserve-3d來開啟三維空間。在偽元素before和after中，將三角形在y軸上旋轉了90度，并在z軸上旋轉了45度，使其看起來像是平面上的三角形。