僅旋轉僞元素後的內容

Question

只能旋轉內容嗎？

div:after { 
    content: "10"; 
    background-color: fuchsia; 
    display: inline-block; 
    transform: rotate(30deg); 
    font-size: 30px; 
} 

實施例圖像：

Answer 1

不，它是不可能的。但是你可以利用兩個:before和:after以達到：

div { 
 
    position: relative; 
 
} 
 

 
div:after{ 
 
    content: "10"; 
 
    display: inline-block; 
 
    transform: rotate(30deg); 
 
    font-size: 30px; 
 
    position: absolute; 
 
    left: 10; 
 
} 
 

 
div:before{ 
 
    content: ""; 
 
    background-color: fuchsia; 
 
    display: inline-block; 
 
    height: 35px; 
 
    width: 35px; 
 
    position: absolute; 
 
    left: 10; 
 
}

<div></div>