반응형
css는 의사 : : after 또는 : before content :“”
어쨌든 의사에 대한 회전 작업을
content:"\24B6"?
유니 코드 기호를 회전하려고합니다.
인라인 요소는 변환 할 수 없으며 의사 요소는 기본적으로 인라인이므로 적용 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>
.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%);
}
이 코드를 확인할 수 있습니다. 나는 당신이 쉽게 이해할 수 있기를 바랍니다.
참고 URL : https://stackoverflow.com/questions/9779919/css-rotate-a-pseudo-after-or-before-content
반응형
'Programing' 카테고리의 다른 글
| Git 원격 URL 변경 후 원격 거부 (얕은 업데이트는 허용되지 않음) (0) | 2020.06.18 |
|---|---|
| SVN은 폴더 자체가 아닌 폴더의 내용을 체크 아웃합니다. (0) | 2020.06.18 |
| C / C ++에서 NULL 포인터 확인 (0) | 2020.06.18 |
| PDO는 마지막으로 삽입 된 ID를 얻습니다 (0) | 2020.06.18 |
| 단위 테스트 : DateTime.Now (0) | 2020.06.18 |