728x90
반응형
코드펜(CodePen) 사용법 및 티스토리 적용방법
https://creative103.tistory.com/134
[TISTORY] 티스토리에 코드펜(CodePen) 적용하기
코드펜은 웹페이지에 HTML, CSS, JavaScript를 코딩함으로써 실행결과를 보여줄 수 있는 사이트 1. 코드펜(CodePen) 접속아래 링크로 들어가 계정 접속 한다.https://codepen.io/trending CodePenAn online code editor,
creative103.tistory.com
코드펜(CodePen) 코드를 가지고 원하는 스타일 재정의 할 수 있다.
1. 코드펜(CodePen) 높이 사이즈 조절
- data-height="원하는 높이값"
2. 코드펜(CodePen) 테마 변경
- 라이트 모드 : data-theme-id="light"
- 다크 모드 : data-theme-id="dark"
3. 코드펜(CodePen) 결과화면 노출 방식
- 결과화면(result) : data-default-tab="result"
- HTML/결과화면 : data-default-tab="html,result"
- CSS/결과화면 : data-default-tab="css,result"
728x90
반응형
'📌 Etc' 카테고리의 다른 글
| [Excel] 엑셀 행/열 삽입 단축키 (0) | 2024.06.04 |
|---|---|
| [Windows] 윈도우11 '추가 옵션 표시' 제거/표시 하기 (0) | 2024.05.29 |
| 모바일 건강보험증 발급 방법 (0) | 2024.05.23 |
| 모바일 신분증 발급 방법 (IC 운전면허증)(온라인/방문 신청) (1) | 2024.05.23 |
| [TISTORY] 티스토리에 코드펜(CodePen) 적용하기 (0) | 2024.05.20 |
