본문 바로가기
티스토리컴파스/◾인용구꾸미기

티스토리 인용구 큰다옴표 닫기 코드 추가 CSS 활용

by 잇츠팁 2024. 12. 11.
반응형

 


 

티스토리 블로그 글을 작성하다보면 인용구를 사용할때가 있습니다. 티스토리 인용구 " 를 사용했을때 큰다옴표 닫기가 적용 안된것을 볼수 있습니다.  생각보다 코드만 변경해면 간단하게 해결 가능합니다.코드를 수정해서 닫기 큰다옴표 있는 인용구를 사용하시길 바랍니다.

티스토리 인용구 " 큰다옴표 닫기 추가하기

 

적용 방법은 아래의 CSS 코드 복사하여 티스토리 블로그 설정 >스킨 편집 > html 편집 > CSS 에 제일 밑에 복사해서 붙여 넣고 적용하시면 됩니다.

	/* 인용구 닫기 따옴표 추가 */

	#tt-body-page blockquote[data-ke-style='style1']::after {

	  content: '';

	  display: block;

	  background: url(https://t1.daumcdn.net/keditor/dist/0.4.9/image/blockquote-style1.svg) no-repeat 50% 0;

	  padding-top: 34px;

	  transform: rotate(180deg);

	}

 


먼저 스킨편집에  들어가면 CSS버튼을 눌러서 제일 아래로 스크롤을 돌려 이동시켜주고 해당 코드를 넣고 적용 버튼을 눌러줍니다.

 


🎈코드를 적용했는데 글을 쓰려고 인용구 사용시 " 큰다옴표가 닫기 버튼이 안만들어진것 처럼 보입니다. 이럴때 미리보기 버튼을 눌러서 미리보기 화면을 보면 적용된것을 확인 할수 있습니다. 똑같이 코드를 넣었다면 아무탈 없이 적용되었습니다.

 

 

미리보기 화면에서 이렇게 큰 다옴표가 닫아진것을 확인할수 있습니다. CSS에 해당 코드만 제일 밑에 복사해서 붙여넣기만 하는 아주 간단하게 변화를 줄수 있습니다. 즐겁게 포스팅하세요