• Q&A
  • 회원가입
  • 로그인

[css] CSS - 네임펜 (= 형광펜) 효과

네임펜 효과.

 

<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

 

코딩/프로그래밍 독학 가이드

방문자 수

오늘 492
어제 1,531
최대 4,391
이달 52,037
전체 1,238,520
찾아주셔서 감사합니다. Since 2012