스킨 테스트용 글입니다.

개발(Dev)/HTML-CSS-JS / / 2020. 9. 9. 15:45
반응형

스킨변경 테스트용 글입니다.

스킨 변경시 확인이 필요한 부분을 이 페이지에 모두 추가해서 테스트 합니다.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog==" crossorigin="anonymous" />

/* 사이드바 홈, 방명록, 태그, link, rss, 로그아웃 아이콘 추가 */
.area_sidebar ul li a::before,
.area_sidebar .list_sns .link_add::before,
.area_sidebar .add_link .link_add::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-style: normal;
	font-variant: normal;
	line-height: 1;
	margin-right: 5px;
}
.area_sidebar ul li.t_menu_home a::before { content: '\f015'; }
.area_sidebar ul li.t_menu_tag a::before { content: '\f02b'; }
.area_sidebar ul li.t_menu_guestbook a::before { content: '\f02d'; }
.area_sidebar .list_sns .link_add::before { content: '\f35d'; }
.area_sidebar .add_link .link_add::before { content: '\f143'; }



/* 사이드바 링크 :hover */
.area_sidebar ul li.t_menu_home a,
.area_sidebar ul li.t_menu_tag a,
.area_sidebar ul li.t_menu_guestbook a,
.area_sidebar .list_sns .link_add,
.area_sidebar .add_link .link_add,
.area_sidebar .box_tool a { margin-bottom: 0; padding: 15px 5px; }

.area_sidebar ul li.t_menu_home a:hover,
.area_sidebar ul li.t_menu_tag a:hover,
.area_sidebar ul li.t_menu_guestbook a:hover,
.area_sidebar .list_sns .link_add:hover,
.area_sidebar .add_link .link_add:hover,
.area_sidebar .box_tool a:hover { background-color: #eaeaea; border-radius: 5px; color: #000; }



/* 사이드바 링크 가로라인 */
.area_sidebar .box_gnb { margin-bottom: 45px; }
.area_sidebar .box_sns, .area_sidebar .add_link { margin-bottom: 30px; }
.area_sidebar .list_sns, .area_sidebar .add_link { border-top: 1px solid #e5e5e5; padding-top: 30px; }
.area_sidebar .box_tool { border-top: 1px solid #e5e5e5; padding-top: 30px; text-align: center; }
.area_sidebar .box_tool .link_tool:before { top: 18px; }



/* 본문 새창링크(_blank) 스타일 수정(icon) */
.article_view a[target='_blank'] { text-decoration: none; padding: 5px; }
.article_view a[target='_blank']:hover { font-weight: bold; background-color: #eaeaea; border-radius: 5px; color: #000; }
.article_view a[target='_blank']::before {
	content: '\f35d';
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-style: normal;
	font-variant: normal;
	line-height: 1;
	margin-right: 5px;
}



/* 접은글(moreless) content 스타일 */
div[data-ke-type='moreLess'].open .moreless-content,
#tt-body-page div[data-ke-type='moreLess'].open .moreless-content {	padding: .5rem;	margin-top: 5px; }

/* theme_pink */
.theme_pink .article_view div[data-ke-type='moreLess'].open .moreless-content,
.theme_pink .article_view #tt-body-page div[data-ke-type='moreLess'].open .moreless-content { border: 1px dashed #ff567a; }

/* theme_blue */
.theme_blue .article_view div[data-ke-type='moreLess'].open .moreless-content,
.theme_blue .article_view #tt-body-page div[data-ke-type='moreLess'].open .moreless-content { border: 1px dashed #4167d9; }

/* theme_green */
.theme_green .article_view div[data-ke-type='moreLess'].open .moreless-content,
.theme_green .article_view #tt-body-page div[data-ke-type='moreLess'].open .moreless-content { border: 1px dashed #11998e; }

/* theme_gray */
.theme_gray .article_view div[data-ke-type='moreLess'].open .moreless-content,
.theme_gray .article_view #tt-body-page div[data-ke-type='moreLess'].open .moreless-content { border: 1px dashed #1d2129; }



/* 접은글(moreless) toggle btn 스타일 */
div[data-ke-type='moreLess'] .btn-toggle-moreless,
#tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless {
	font-weight: bold;
	min-width: 70px;
}

div[data-ke-type='moreLess'] .btn-toggle-moreless::before,
#tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless::before {
	content: '\f055';
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-style: normal;
	font-variant: normal;
	line-height: 1;
	margin-right: 5px;
}

div[data-ke-type='moreLess'].open .btn-toggle-moreless::before,
#tt-body-page div[data-ke-type='moreLess'].open .btn-toggle-moreless::before {
	content: '\f056';
}

/* theme_pink */
.theme_pink .article_view div[data-ke-type='moreLess'] .btn-toggle-moreless,
.theme_pink .article_view #tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless {
  color: #ff567a!important; }

/* theme_blue */
.theme_blue .article_view div[data-ke-type='moreLess'] .btn-toggle-moreless,
.theme_blue .article_view #tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless {
  color: #4167d9!important; }

/* theme_green */
.theme_green .article_view div[data-ke-type='moreLess'] .btn-toggle-moreless,
.theme_green .article_view #tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless {
  color: #11998e!important; }

/* theme_gray */
.theme_gray .article_view div[data-ke-type='moreLess'] .btn-toggle-moreless,
.theme_gray .article_view #tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless {
  color: #1d2129!important; }

스킨 테스트용 글입니다.

1. h1 ~ h6

H1 Test.

H2 Test.

H3 Test.

H4 Test.

H5 Test.
H6 Test.

2. 코드블럭

<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
		
		<title>PageTitle</title>
        
		<script>
			window.onload = function () {
				// onload script insert
                let a = 1, b = 2;
                if( a >= b) {
                	alert('a >=b')
                } else if(a === b) {
                	alert('a === b');
                } else {
                	alert('error!!');
                }
			};
		</script>
	</head>
	<body>
		<div>
        	<p>코드블럭 테스트용 코드</p>        
        </div>
	</body>
</html>

3. 첨부파일

codeBlockHtml.html
0.00MB

4. 접은글

더보기

아이들의 추억과 딴은 북간도에 이웃 봅니다. 그리워 파란 않은 노새, 아스라히 하나에 버리었습니다. 밤이 밤을 나는 속의 봅니다. 오는 묻힌 위에 벌써 자랑처럼 잠, 다 멀리 딴은 봅니다. 이국 된 내일 이름과, 버리었습니다. 사랑과 언덕 마디씩 하나에 봅니다. 둘 이름을 내 헤일 헤는 있습니다. 무엇인지 아직 하나에 거외다. 써 못 언덕 별 가득 슬퍼하는 이웃 내 봅니다. 나의 아무 까닭이요, 이런 옥 풀이 별 가을로 있습니다. 어머님, 아침이 가난한 차 덮어 추억과 시와 계십니다.

 

토끼, 하나의 노루, 멀리 거외다. 하나에 아직 피어나듯이 이런 벌써 소학교 별들을 버리었습니다. 노새, 멀리 오면 불러 거외다. 그리워 릴케 가득 비둘기, 경, 보고, 별 봅니다. 위에도 쓸쓸함과 계집애들의 내일 아침이 계절이 까닭입니다. 당신은 불러 이름과, 가을로 별들을 계절이 위에 멀듯이, 계십니다. 헤는 내린 위에도 하나에 아무 거외다. 나는 그러나 마리아 릴케 어머님, 많은 있습니다. 이 지나고 봄이 패, 멀리 다 언덕 불러 새워 계십니다.

 

가을 하나에 아직 같이 이름자를 있습니다. 아스라히 멀듯이, 어머님, 오는 버리었습니다. 잔디가 노새, 오면 나는 있습니다. 강아지, 별 토끼, 다 묻힌 별빛이 어머님, 봅니다. 나의 하나에 남은 내일 릴케 쉬이 거외다. 너무나 어머니, 까닭이요, 이제 이름과, 사랑과 있습니다. 없이 별 어머님, 노새, 라이너 밤이 있습니다. 헤는 보고, 계절이 지나고 어머님, 거외다. 내 다하지 별 당신은 있습니다.

 

아름다운 하나에 자랑처럼 버리었습니다. 없이 하나에 어머니 별 별 했던 벌레는 이제 듯합니다. 했던 가을 별이 지나가는 걱정도 듯합니다. 아침이 하나의 것은 버리었습니다. 지나고 나는 위에 헤는 봄이 무성할 별들을 버리었습니다. 언덕 헤일 어머님, 다 파란 슬퍼하는 까닭입니다. 이름과, 피어나듯이 그러나 경, 소녀들의 못 까닭입니다. 까닭이요, 딴은 파란 다하지 거외다. 멀리 별 무엇인지 경, 봅니다.

 

말 어머니 토끼, 강아지, 내일 별 걱정도 듯합니다. 계절이 잠, 이제 동경과 나는 무성할 계십니다. 당신은 언덕 무엇인지 별빛이 불러 파란 마디씩 위에 버리었습니다. 이름을 파란 차 잠, 봅니다. 아름다운 헤는 둘 헤일 당신은 계절이 다 쓸쓸함과 버리었습니다. 하늘에는 하나에 하나에 나의 있습니다. 속의 별 한 나는 아름다운 까닭입니다. 아스라히 쓸쓸함과 하나에 같이 아침이 까닭입니다. 멀듯이, 위에 다하지 어머니 아무 잔디가 이름자를 계집애들의 까닭입니다.

 

다하지 별빛이 나의 별 별을 노새, 겨울이 계집애들의 거외다. 무엇인지 이웃 하나의 토끼, 별에도 것은 하늘에는 불러 패, 까닭입니다. 옥 별에도 강아지, 까닭이요, 없이 이름자 겨울이 거외다. 별 별들을 딴은 불러 라이너 계십니다. 걱정도 것은 이름을 아름다운 계집애들의 별빛이 마리아 그리워 까닭입니다. 경, 불러 써 내 어머니, 가슴속에 까닭이요, 아직 계십니다. 우는 헤는 딴은 별 겨울이 이국 새겨지는 아침이 아무 까닭입니다. 딴은 책상을 써 덮어 나는 별들을 있습니다. 별빛이 가득 쉬이 잠, 하나에 하나에 계십니다. 어머니 다 이름과, 가난한 내 내일 듯합니다. 이런 오면 속의 이름을 별이 하나의 새워 까닭입니다.

 

시인의 그리워 없이 내 쓸쓸함과 북간도에 거외다. 멀리 써 프랑시스 차 노루, 까닭입니다. 별 책상을 어머니 잔디가 속의 밤을 소학교 있습니다. 시인의 강아지, 밤이 있습니다. 부끄러운 시인의 피어나듯이 어머니, 너무나 별들을 하나 하나의 애기 있습니다. 쓸쓸함과 노루, 소학교 봅니다. 헤일 새워 강아지, 하나에 까닭입니다. 가득 않은 그리고 없이 거외다. 헤는 이름과, 나는 어머님, 내일 된 묻힌 어머님, 봅니다. 위에도 이름과 별들을 이름을 벌써 멀듯이, 마리아 있습니다.

 

너무나 것은 아스라히 피어나듯이 별 버리었습니다. 잔디가 노루, 까닭이요, 시와 라이너 말 거외다. 다하지 그리워 그리고 어머님, 불러 당신은 추억과 봅니다. 같이 이름을 까닭이요, 이제 듯합니다. 어머님, 무덤 새워 이름과, 내일 파란 이런 청춘이 거외다. 별이 내일 밤을 속의 잔디가 옥 오면 이름과, 말 거외다. 한 까닭이요, 노새, 있습니다. 한 것은 무엇인지 헤일 슬퍼하는 아스라히 릴케 이름과, 있습니다. 내일 토끼, 말 나의 나는 노새, 불러 가득 시와 듯합니다. 별을 풀이 노새, 위에 별 이네들은 파란 보고, 버리었습니다. 내린 나는 별이 된 그리워 자랑처럼 있습니다.

 

별 내 이름자 사랑과 보고, 슬퍼하는 흙으로 잠, 듯합니다. 언덕 새워 남은 나는 무덤 밤이 당신은 옥 불러 버리었습니다. 노루, 우는 소학교 멀리 별 때 자랑처럼 있습니다. 추억과 하나에 부끄러운 가을로 오는 아름다운 불러 어머니 당신은 까닭입니다. 피어나듯이 강아지, 멀듯이, 옥 부끄러운 내 무성할 못 쉬이 버리었습니다. 청춘이 하나에 아침이 속의 말 차 이웃 나는 나의 거외다. 밤이 시와 강아지, 내린 겨울이 하나에 이 아무 별 듯합니다. 흙으로 위에도 써 나는 소녀들의 당신은 있습니다. 나는 자랑처럼 이런 이런 시인의 멀듯이, 그리고 계십니다.

5. 서식 테스트

div Box 예제입니다.

6. link test

Google

Naver

7. 사진 추가

티스토리 스킨 [Portfolio] 기본 배경 사진

8. list style

  • list 1 - 1
  • list 1 - 2
  • list 1 - 3

  • list 2 - 1
  • list 2 - 2
  • list 2 - 3

  1. list 3 - 1
  2. list 3 - 2
  3. list 3 - 3

9. 999

 

 

'개발(Dev) > HTML-CSS-JS' 카테고리의 다른 글

자바스크립트(javascript) 없이 CSS만으로 만든 탭메뉴  (0) 2021.01.29
티스토리 각주 사용방법  (8) 2019.07.05
클립보드 복사기능 [clipboard.js] 사용방법  (2) 2018.10.05
border 속성 모서리 값  (4) 2018.07.18
말줄임(ellipsis) 두줄이상에 적용하는 방법  (0) 2018.05.09
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기
개발(Dev)/HTML-CSS-JS 관련 글
글 더보기

티스토리툴바