네임펜 효과.
<style> .namepen { width: fit-content; padding: 0 0.25%; position: relative; z-index: 1; } .namepen::after { position: absolute; display: block; content: '\00a0'; width: 100%; left: 0; right: 0; top: 50%; height: 60%; background-color: #ffe360; transform: skew(-5deg); z-index: -1; } </style> <div> <span class="namepen">홈짱닷컴 Homzzang.com</span> </div> 결과보기
<style>
.namepen {
width: fit-content;
padding: 0 0.25%;
position: relative;
z-index: 1;
}
.namepen::after {
position: absolute;
display: block;
content: '\00a0';
width: 100%;
left: 0;
right: 0;
top: 50%;
height: 60%;
background-color: #ffe360;
transform: skew(-5deg);
z-index: -1;
</style>
<div>
<span class="namepen">홈짱닷컴 Homzzang.com</span>
</div>
결과보기
몰라무서워 님 (201216) https://sir.kr/g5_tip/14958