목록HTML (105)
투케이2K
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /* =========================== */ [결과 출력] [브라우저] [모바일] /* =========================== */ /* =========================== */ [요약 설명] 1. viewport : 메타 태그로 반응형 뷰 포트 설정 실시 2. media : 실시간 반응형 뷰 포트 디스플레이 화면 크기 확인 3. min-wi..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : inteli j 개발 언어 : spring /* =========================== */ /* =========================== */ [방법 설명] /* =========================== */ /* =========================== */ [소스 코드] [application.yml >> DB 접속 경로, 서버 포트] spring: devtools: livereload: enabled: true datasource: driver-class-name: oracle.jdbc.OracleDriver url..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /* =========================== */ /* =========================== */ [요약 설명] /* [JS 요약 설명] 1. overflow : 스크롤 여부를 결정하는 css 속성입니다 2. bind : 이벤트 처리를 수행하는 메소드입니다 3. 모바일 터치 이벤트 동작 시 start, move 쪽에서 body 스크롤 막고, end 상태일 때 body 스크롤..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [JS 요약 설명] 1. window.onload : 웹 브라우저 로딩 완료 상태를 확인합니다 2. window.g..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] one two three four /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] ONE TWO THREE FOUR /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] 텍스트 확인 텍스트 변경 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2. ..
/* =========================== */ [ 참고 사이트 ] /* =========================== */ /* =========================== */ [사이트 주소] http://tcpschool.com/html-tag-attrs/input-accept 코딩교육 티씨피스쿨 4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등 tcpschool.com /* =========================== */
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] one two three four /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] URL 저장 그림 저장 지우기 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2...
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] QR 생성 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2. width : ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] 브라우저 이동 파일 이동 태그 이동 함수 호출 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /* =========================== */ /* =========================== */ [결과 출력] [적용 (전)] [적용 (후)] [저장 경로] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] 팝업창 호출 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2. width : 가..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] #btn_container { width : 30%; height : 10%; margin : 0 auto; padding : 0; border : none; background-color : #026f2a; /* 컨테이너 배치 정렬 실시 */ float : top; position : relative; top : 15%; left : 0%; /* div 테두리 영역 둥글게 설정 : 각 모서리 모두 동일..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] TEST TEST TEST TEST /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [CSS 요소 설명] 1. font-family : 폰트 표시 형태 스타일 ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] 동적 추가 /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2. width : 가로 크기 ..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] ONE TWO /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */ /* =========================== */ [요약 설명] /* [요소 설명] 1. font-family : 폰트 표시 형태 스타일 지정 2. width : 가로 크..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /*=================== [브라우저 단 처리] ===================*/ /* 드랍할 위치 태그에 다른 이벤트가 발생하는 것을 방지 */ function allowDrop(evt) { evt.preventDefault(); }; /* 드래그 시 이벤트 함수 */ function drag(evt) { /* 선택한 div id 값 확인 */ dragId = evt.target.id..
/* =========================== */ [ 개발 환경 설정 ] 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery /* =========================== */ /* =========================== */ [소스 코드] /* =========================== */ /* =========================== */ [결과 출력] /* =========================== */