css обертати псевдо: після або: перед вмістом: ""


159

у будь-якому випадку зробити обертання на псевдо

content:"\24B6"? 

Я намагаюся повернути символ unicode.


Ви намагаєтесь одноразово повернути псевдоелемент (30deg) чи нескінченно обертати його? Не вказував.
RealMJDev

Відповіді:


358

Вбудовані елементи не можуть бути перетворені, а псевдоелементи за замовчуванням вбудовані в рядки, тому потрібно застосувати display: blockабо display: inline-blockперетворити їх:

#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>


-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%);
}

ви можете перевірити цей код. сподіваюся, ви легко зрозумієте.


1
Насправді я не легко розумію :) Корисна відповідь пояснила б, що робить код, і чим він відрізняється від прийнятої відповіді. Це також був би фрагмент, який можна виконати, як прийнята відповідь.
Дан Даскалеску
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.