css xoay một giả: sau hoặc: trước nội dung:

159

Dù sao để thực hiện một công việc xoay vòng trên giả

content:"\24B6"?

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

css rotation pseudo-element

— lệch
nguồn

Bạn đang cố gắng xoay phần tử giả một lần (30deg) hay xoay nó vô hạn? Không chỉ định.

— RealMJDev

358

Các phần tử nội tuyến không thể được chuyển đổi và các phần tử giả là nội tuyến theo mặc định, vì vậy bạn phải áp dụng display: blockhoặ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>

Mở rộng đoạn trích

— phương pháp
nguồn

-1

.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

— buồn
nguồn

1

Trên thực tế tôi không dễ hiểu :) Một câu trả lời hữu ích sẽ giải thích mã đó làm gì và nó khác với câu trả lời được chấp nhận như thế nào. Nó cũng sẽ là một đoạn có thể chạy được, giống như câu trả lời được chấp nhận.

— Dan Dascalescu