거지같은 접은글 꾸미기

하ㅏ하ㅏ하ㅏ하하하ㅏ하하하하하 

드디어 했다. 진짜 온갖 검색이란 검색은 다 해보고 

내가 생각해낼 수 있는 css는 모두 다 쥐어짜서 해본 듯 

 

그래서 현재 적용된 나의 접은글은 왼쪽과도 같은 모습.

더보기, 접기 글자는 글 쓰거나 수정 할 때 html 들어가서

직접 data-text-more="더보기" data-text-less="닫기" 이 부분을 수정하면 되고 (난 귀찮아서 패스)

글자 앞에 이모티콘은 fontawesome 에서 가져옴 

 

티스토리에 적용한 css는 

/*접은글*/

.btn-toggle-moreless {
		font-size:11px !important;
		color: #fff !important;
		background-color:#bec5ed;
		padding-left:3px; 
		padding-right:3px;
}

.moreless-contect {
		font-size:11px !important;
		color: #fff !important;
		background-color:#bec5ed;
		padding-left:3px; 
		padding-right:3px; 
}

.btn-toggle-moreless:before {
	content:'\f103'!important;
	font-family: fontawesome ;
	font-size: 12px; 
	padding-right:2px; 
}
.open .btn-toggle-moreless:before {
	content:'\f102'!important;
	font-family: fontawesome ;
	padding-right:2px; 
}

 

솔직히 위에 저게 맞는지도 모르겠다. 그냥 검색해서 이것저것 짜집기하고 막 넣어서 해봤는데 적용된거라

그냥 저렇게 쓰는 중임ㅋㅋㅋㅋㅋㅋㅋ 게다가 !important 를 좀 남발한 거 같은 느낌이긴 한데 

없어도 되긴 할 듯? 하지만 아직까지는 저 스타일 때문에 스킨이 꼬이거나 한 건 없기 때문에 대만족 중임 ^____^ 

뿌듯뿌듯