css xoay một giả: sau khi hay: trước khi nội dung: ""

Question

nào để thực hiện một công việc luân chuyển trên giả

content:"\24B6"? 

Tôi đang cố gắng để xoay một biểu tượng unicode.

Answer 1

yếu tố Inline không thể được chuyển đổi, và các yếu tố giả là inline theo mặc định, vì vậy bạn phải áp dụng display: block hoặc display: inline-block để chuyển đổi chúng:

#whatever:after { 
 
    content:"\24B6"; 
 
    display: inline-block; 
 
    -webkit-transform: rotate(30deg); 
 
    -moz-transform: rotate(30deg); 
 
    -o-transform: rotate(30deg); 
 
    -ms-transform: rotate(30deg); 
 
    transform: rotate(30deg); 
 
}

<div id="whatever">Some text </div>

Answer 2

.process-list:after{ 
    content: "\2191"; 
    position: absolute; 
    top:50%; 
    right:-8px; 
    background-color: #ea1f41; 
    width:35px; 
    height: 35px; 
    border:2px solid #ffffff; 
    border-radius: 5px; 
    color: #ffffff; 
    z-index: 10000; 
    -webkit-transform: rotate(50deg) translateY(-50%); 
    -moz-transform: rotate(50deg) translateY(-50%); 
    -ms-transform: rotate(50deg) translateY(-50%); 
    -o-transform: rotate(50deg) translateY(-50%); 
    transform: rotate(50deg) translateY(-50%); 
} 

bạn có thể kiểm tra mã này. tôi hy vọng bạn sẽ dễ dàng hiểu được.