책 이미지
eBook 미리보기
책 정보
· 제목 : 인터넷 프로그래밍
· 분류 : 국내도서 > 컴퓨터/모바일 > 컴퓨터 공학 > 컴퓨터공학/전산학 개론
· ISBN : 9788942909827
· 쪽수 : 605쪽
· 출판일 : 2007-09-15
· 분류 : 국내도서 > 컴퓨터/모바일 > 컴퓨터 공학 > 컴퓨터공학/전산학 개론
· ISBN : 9788942909827
· 쪽수 : 605쪽
· 출판일 : 2007-09-15
책 소개
인터넷 프로그래밍 활용 입문서. 초보자를 위해 기초 과정에서부터 고급테크닉까지 체계적 이론과 실습을 통하여 공부할 수 있도록 했다. 홈페이지를 기획할 수 있는 방향제시와 구성방법 및 HTML 태그를 소개한다.
목차
Chaper 01 인터넷의 이해
01 인터넷의 역사 14
1. 인터넷이란 14
2. 인터넷의 역사 14
3. 국내 인터넷 역사 15
4. 국내 인터넷 연대표 16
02 HTML 정의 및 특징 20
1. HTML 정의 20
2. HTML 특징 21
3. HTML 기본 형식 22
4. 메모장을 사용하여 HTML 문서 작성 24
5. 인터넷 익스플로러로 HTML 문서 보기 28
Chaper 02 홈페이지 기획 제작
01 홈페이지 제작 목적 32
1. HTML은 무엇인가? 32
2. 홈페이지 기획을 하는 이유 32
3. 홈페이지는 왜 필요하고 왜 만드는 것인가? 33
02 홈페이지 기획 제작 방법 34
1. 주제를 정하기 34
2. 시장조사와 자료분석 설계하기 34
3. 홈페이지 디자인구조 스케치하기 35
4. 홈페이지의 목표와 전략 세우기 36
5. 홈페이지 제작에 필요한 프로젝트팀 구성하기 36
6. 제작에 필요한 예산·스케줄 책정하기 37
7. 홈페이지 제작하기 39
8. 데이터 전송 및 서버에 업로드하기 40
9. 홈페이지 홍보 및 관리하기 40
03 웹페이지 기획 및 제작을 위한 참고사항 44
1. 웹페이지 기획을 위한 참고사항 44
2. 웹페이지 제작을 위한 참고사항 45
04 웹사이트 관리자가 알아야 할 요소 49
1. 자신만의 차별화된 이미지 49
2. 메뉴 구성과 파트너 50
3. 자신감과 열정 51
4. 새로운 메뉴와 신뢰감 51
05 홈페이지 제작과 관련된 기술과 준비 53
1. 웹디자인 53
2. 웹프로그램 56
Chaper 03 기초 문서 제작 태그
01 홈페이지 제작 목적 60
1. 문단과 관련된 속성 태그 60
2. 줄 바꿈
태그 62
3. 문단을 바꾸는
태그 64
4. 고정영역 문단
태그 67
5. 태그를 보여주는태그 69 <BR> 6. 가운데에 정렬하는 <center> 태그 70 <BR> 7. 문단 속성을 정렬하는 <div align=left, center, right, justify> 태그 71 <BR> <BR> 02 글자와 관련된 태그 73 <BR> 1. 제목글자 <hn> 태그 73 <BR> 2. 글자 크기 지정 <font size> 태그 75 <BR> 3. 글자 색상 지정 <font color> 태그 79 <BR> 4. 글자 서체 지정 <font face> 태그 80 <BR> <BR> 03 글자 꾸밈(물리적/논리적 스타일) 태그 84 <BR> 1. 물리적(Physical) 스타일 태그 85 <BR> 2. 논리적(Logical) 스타일 태그 87 <BR> <BR> 04 주석넣기와 풍선 도움말 넣기 태그 89 <BR> 1. 주석넣기 태그 89 <BR> 2. 풍선 도움말 넣기 태그 90 <BR> <BR> 05 선그리기와 들여쓰기 태그 92 <BR> 1. 수평선 넣기 <hr> 태그 92 <BR> 2. 들여쓰기 <blockquote> 태그 94 <BR> <BR> 06 문서 전체 속성을 지정하는 <body> 태그 95 <BR> 1. body 태그로 HTML 문서에 배경색 주기 96 <BR> 2. HTML 문서 글자색 바꾸기 97 <BR> 3. body 태그의 속성 99 <BR> <BR> 07 특수문자 표시와 메타 <meta> 태그101 <BR> 1. 일반적인 특수문자 101 <BR> 2. 공백문자( )103 <BR> 3. 메타(meta) 태그 104 <BR> <BR> 08 목록 관련 태그 107 <BR> 1. 번호 없는 목록 만들기(<ul>,</ul>) 108 <BR> 2. 번호 달린 목록 만들기(<ol>,</ol>) 109 <BR> 3. 정의 목록 만들기(<dl>,</dl>)-자동 들여쓰기 111 <BR> 4. 계층 목록 만들기 112 <BR> <BR> Chaper04 <img> 태그로 이미지 삽입하기<BR> <BR> 01 이미지 삽입 <img> 태그116 <BR> 1. img 폴더 위치에 따라 태그 넣기 117 <BR> 2. 이미지 크기조절(width height) 태그 넣기 118 <BR> 3. 이미지 풍선 도움말(ait) 태그 넣기 121 <BR> 4. 이미지 옆의 텍스트 위치 지정(align) 태그 넣기 122 <BR> 5. 이미지 여백 설정(hspace) 태그 속성 넣기 124 <BR> 6. 이미지 테두리 설정(border) 태그 속성 넣기 126 <BR> 7. 스타일시트(CSS)를 이용한 이미지 테두리선 변경 127 <BR> <BR> 02 배경 이미지 <img> 태그129 <BR> 1. 배경에 그림파일 넣기 129 <BR> 2. 배경 고정(bgproperties) 태그 속성 131 <BR> <BR> Chaper 05 링크에 관한 <a> 태그 활용하기<BR> <BR> <BR> 01 <href=링크주소> 이용 134 <BR> 1. 경로를 통해 링크시키기 134 <BR> 2. 전자우편 연결하기 137 <BR> 3. 멀티미디어 파일 링크 138 <BR> <BR> 02 책갈피 태그 140 <BR> 1. 책갈피-문서내의 연결 140 <BR> 2. 책갈피-다른 문서의 연결 144 <BR> <BR> 03 target 속성을 이용한 대상 창 설정 148 <BR> 1. 새 창 (target=_blank) 속성 링크 148 <BR> 2. 작업 중인 문서에 나타나는 (target=_self) 속성 링크 149 <BR> <BR> 04 이미지 맵 152 <BR> 1. 이미지 맵의 형태와 태그 152 <BR> 2. 이미지맵 사용법 153 <BR> <BR> Chaper 06 <table> 태그로 표만들기 <BR> <BR> 01 table 태그 이용하기 156 <BR> 1. table 구조 157 <BR> 2. table 태그의 속성 158 <BR> <BR> 02 행과 열 꾸미기 159 <BR> <BR> 03 table 제목 넣기 162 <BR> <BR> 04 셀과 열 합치기 164 <BR> 1. colspan의 table 열 합치기 164 <BR> 2. rowspan의 table 행 합치기 166 <BR> 3. rowspan과 colspan을 이용한 다양한 table 만들기 168 <BR> <BR> Chaper 07 프레임(frame) 나누기 <BR> <BR> 01 프레임의 기본 구조 172 <BR> 1. 단일 프레임 구조 174 <BR> 2. 프레임 경계면 고정하기 175 <BR> 3. 프레임 경계면 감추기 177 <BR> 4. 경계면과 스크롤바 179 <BR> 5. border 옵션 삭제하기 180 <BR> 6. left.htm과 main.htm 파일로 frameset 작업하기 181 <BR> <BR> 02 수평 프레임 분할 183 <BR> 1. 수평 프레임 분할 183 <BR> 2. 수평 프레임 3개 분할 185 <BR> <BR> 03 다중 프레임 188 <BR> 1. 위 및 중첩된 왼쪽 프레임 188 <BR> 2. 다중 프레임 경계선 없애기 190 <BR> <BR> 04 프레임에 링크와 target 지정 192 <BR> 1. target이 지정된 다중프레임 193 <BR> 2. 프레임에 name 붙이기 195 <BR> <BR> 05 아이프레임(iframe)의 활용 198 <BR> <BR> Chaper 08 멀티미디어의 활용 <BR> <BR> 01 멀티미디어 파일 204 <BR> <BR> 02 멀티미디어 관련 태그 206 <BR> <BR> 03 <embed>태그로 사운드 파일 활용 207 <BR> 1. 배경 음악 넣기 207 <BR> 2. 멀티미디어 재생기의 크기조절 208 <BR> 3. 멀티미디어 재생기의 자동실행 제어 209 <BR> 4. 멀티미디어 재생기 감추기 210 <BR> <BR> 04 <object> 태그로 사운드 파일 활용 212 <BR> 1. <object> 태그를 통한 사운드 재생 212 <BR> <BR> 05 태그로 동영상 파일의 재생 214 <BR> 1. <embed> 태그를 통한 동영상 표현 214 <BR> 2. <object> 태그를 통한 동영상 표현 215 <BR> <BR> Chaper 09 CGI 양식으로 회원 전용 공간 만들기 <BR> <BR> 01 CGI란? 218 <BR> 1. CGI의 개념 218 <BR> 2. 기본 형식 218 <BR> <BR> 02 기본 입력틀 만들기 221 <BR> 1. 기본 입력틀 만들기 221 <BR> 2. 입력틀의 길이 조정하기 222 <BR> <BR> 03 패스워드 입력틀 만들기 224 <BR> <BR> 04 라디오 단추 만들기 226 <BR> <BR> 05 체크박스 단추 만들기 230 <BR> <BR> 06 선택 목록 만들기 233 <BR> <BR> 07 글틀박스 만들기 235 <BR> <BR> 08 보내기·취소하기 버튼 만들기 237 <BR> <BR> Chaper 10 CSS로 홈페이지 꾸미기 <BR> <BR> 01 선택자 이용하기 240 <BR> 02 class 지정하기 243 <BR> 03 문자열의 속성 지정하기 245 <BR> 04 텍스트 박스 지정을 위한 스타일 속성 252 <BR> 05 링크 걸린 글자에 밑줄 없애기 257 <BR> 06 배경의 속성 지정하기 259 <BR> <BR> Chaper 11 홈페이지 게시판을 위한 도구 <BR> <BR> 01 APM_Setup 설치하기 270 <BR> 1. APM_Setup 다운받기 270 <BR> 2. APM_Setup 설치 방법 271 <BR> <BR> 02 MySQL 관리(phpMyAdmin)를 위한 DB 구축하기 275 <BR> <BR> 03 제로보드 설치하기 279 <BR> 1. 제로보드 소스 구하는 방법 279 <BR> 2. 제로보드 설치하기 283 <BR> 3. MySQL DB 설정하기 284 <BR> 4. 최고 관리자 정보 입력하기 284 <BR> 5. 설치 완료하기 285 <BR> <BR> 04 제로보드 게시판 만들기 286 <BR> 1. 관리자 페이지 요약 286 <BR> 2. 상단 전체 관리 메뉴 286 <BR> 3. 등록된 그룹 관리 메뉴 287 <BR> 4. 그룹 생성/삭제 287 <BR> 5. 그룹 생성하기 288 <BR> 6. 게시판 만들기 289 <BR> <BR> 05 설치 후 확인사항 290 <BR> <BR> 06 제로보드 디렉터리 구조 292 <BR> <BR> 07 외부 로그인 사용법 293 <BR> <BR> 08 알툴즈 설치 방법 296 <BR> 1. 시스템 요구 사항 296 <BR> 2. 알툴즈 설치하기 296</p></div> </div> <div id="tab4" class="tab-content"> <em class="anchor" id="bookAuthor"></em> <h3>저자소개</h3> <div id="innerAuthor" class="content-inner" style="border: 1px solid #ececec; border-radius: 5px; margin-bottom:30px; padding: 5px;"> <div style="min-height: 40px;"> <span class="author-name">강준길 (지은이)</span> <a class="author-more" rel="noreferrer" target="_blank" href="https://www.aladin.co.kr/author/wauthor_overview.aspx?AuthorSearch=@1018&partner=bookprice">정보 더보기</a><br/> <div id="author-info" class="indent">현재 광운대학교 전자공학과 교수.</div> </div> <div class="authInfo-more"><span>펼치기</span><i class="i-more"></i></div> <div style="margin:10px 0px 10px 0px;"> <div style="margin-top: 5px; font-weight: bold;">강준길의 다른 책 > </div> <div class="related"> <a href="/compare.jsp?isbn=5000038249"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/5000038249.jpg" alt=" 데이타통신.컴퓨터네트워크 및 OSI" onerror="this.src='./img/prepare.png'"></div> <div class="related-title"> 데이타통신.컴퓨터네트워크 및 OSI</div> <div class="related-author">강준길 </div> </a> </div> <div class="clear"></div> </div><div class="clear"></div> </div> <div id="innerAuthor" class="content-inner" style="border: 1px solid #ececec; border-radius: 5px; margin-bottom:30px; padding: 5px;"> <div style="min-height: 40px;"> <span class="author-name">조성수 (지은이)</span> <a class="author-more" rel="noreferrer" target="_blank" href="https://www.aladin.co.kr/author/wauthor_overview.aspx?AuthorSearch=@95235&partner=bookprice">정보 더보기</a><br/> <div id="author-info" class="indent">현재 광운대학교 전자공학 박사과정.</div> </div> <div class="authInfo-more"><span>펼치기</span><i class="i-more"></i></div> <div style="margin:10px 0px 10px 0px;"> <div style="margin-top: 5px; font-weight: bold;">조성수의 다른 책 > </div> <div class="related"> <a href="/compare.jsp?isbn=9788942907021"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9788942907021.jpg" alt=" 전기내선공사 실기 실습" onerror="this.src='./img/prepare.png'"></div> <div class="related-title"> 전기내선공사 실기 실습</div> <div class="related-author">조성수 </div> </a> </div> <div class="clear"></div> </div><div class="clear"></div> </div> <div id="innerAuthor" class="content-inner" style="border: 1px solid #ececec; border-radius: 5px; margin-bottom:30px; padding: 5px;"> <div style="min-height: 40px;"> <span class="author-name">이종용 (지은이)</span> <a class="author-more" rel="noreferrer" target="_blank" href="https://www.aladin.co.kr/author/wauthor_overview.aspx?AuthorSearch=@300636&partner=bookprice">정보 더보기</a><br/> <div id="author-info" class="indent">현재 광운대학교 교양학부 교수.</div> </div> <div class="authInfo-more"><span>펼치기</span><i class="i-more"></i></div> <div style="margin:10px 0px 10px 0px;"> <div class="clear"></div> </div><div class="clear"></div> </div> </div> <div id="tab7" class="tab-content"> <em class="anchor" id="bookRelate"></em> <h3>추천도서</h3> <div class="content-inner" style="border: 1px solid #ececec; border-radius: 5px; margin-bottom:30px; padding: 5px;"> <div style="font-weight:bold;">분야의 베스트셀러 > </div> <div class="related"> <a href="/compare.jsp?isbn=9791193083321"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791193083321.jpg" alt="AI 프로토타이핑 실전 - 기획 아이디어를 빠르게 실현하는" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">AI 프로토타이핑 실전 - 기획 아이디어를 빠르게 실현하는</div> <div class="related-author">김성박 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791193059715"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791193059715.jpg" alt="요즘 교사를 위한 에듀테크 5대장 : 캔바, 패들렛, 북크리에이터, 노션, 챗GPT?제미나이 - 수업준비, 학급경영, 행정업무, 상담, 연수준비, 개인업무, 교사협업, 바이브코딩 어떻게 활용했고, 어떻게 활용할 수 있는지!" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">요즘 교사를 위한 에듀테크 5대장 : 캔바, 패들렛, 북크리에이터, 노션, 챗GPT?제미나이 - 수업준비, 학급경영, 행정업무, 상담, 연수준비, 개인업무, 교사협업, 바이브코딩 어떻게 활용했고, 어떻게 활용할 수 있는지!</div> <div class="related-author">안익재, 황의태 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791199529847"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791199529847.jpg" alt="혼자 공부하는 바이브 코딩 with 클로드 코드 - AI와 1:1 대화하며 배우는 첫 코딩 자습서 | 명령어 모음 별책 부록·저자 직강 유튜브·15개 프로젝트 파일 제공·Q&A 채널 운영" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">혼자 공부하는 바이브 코딩 with 클로드 코드 - AI와 1:1 대화하며 배우는 첫 코딩 자습서 | 명령어 모음 별책 부록·저자 직강 유튜브·15개 프로젝트 파일 제공·Q&A 채널 운영</div> <div class="related-author">조태호 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791157847679"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791157847679.jpg" alt="박태웅의 AI 강의 2025 - 인공지능의 출현부터 일상으로의 침투까지 우리와 미래를 함께할 새로운 지능의 모든 것" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">박태웅의 AI 강의 2025 - 인공지능의 출현부터 일상으로의 침투까지 우리와 미래를 함께할 새로운 지능의 모든 것</div> <div class="related-author">박태웅 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791194084242"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791194084242.jpg" alt="챗GPT·퍼플렉시티·클로드·코파일럿·제미나이 다 잘함 - 97가지 활용 사례로 배우는 최강 AI 5대장 완전정복" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">챗GPT·퍼플렉시티·클로드·코파일럿·제미나이 다 잘함 - 97가지 활용 사례로 배우는 최강 AI 5대장 완전정복</div> <div class="related-author">이호정 </div> </a> </div> <div class="clear"></div> </div> <div class="content-inner" style="border: 1px solid #ececec; border-radius: 5px; margin-bottom:30px; padding: 5px;"> <div style="font-weight:bold;">분야의 신간도서 > </div> <div class="related"> <a href="/compare.jsp?isbn=9791175790049"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791175790049.jpg" alt="퀵스타트 SQL with 챗GPT - AI와 협업해 빠르게 배우는 SQL 작성·최적화·튜닝 실전 가이드" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">퀵스타트 SQL with 챗GPT - AI와 협업해 빠르게 배우는 SQL 작성·최적화·튜닝 실전 가이드</div> <div class="related-author">정미나 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791193205785"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791193205785.jpg" alt="현직교사가 만든 가장 쉬운 미리캔버스 수업 활용! MiriCanvas(미리캔버스)로 무엇이든 만들 수 있다 - 교사를 위한 미리캔버스 수업 활용" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">현직교사가 만든 가장 쉬운 미리캔버스 수업 활용! MiriCanvas(미리캔버스)로 무엇이든 만들 수 있다 - 교사를 위한 미리캔버스 수업 활용</div> <div class="related-author">김동은, 김효민, 박채린, 이희정, 임준열 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9788965404286"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9788965404286.jpg" alt="어쩌다 AI, 실전으로 뛰어든 3년의 기록 - 공공기관 팀장이 전하는 AI 정책·기획·활용의 시간" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">어쩌다 AI, 실전으로 뛰어든 3년의 기록 - 공공기관 팀장이 전하는 AI 정책·기획·활용의 시간</div> <div class="related-author">심형섭 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9791143407320"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9791143407320.jpg" alt="2026 시대에듀 Win-Q 전자캐드기능사 필기 단기합격 - 10년간 빈출문제로 한번에 끝내는! 2025년 최근 기출복원문제 수록! 핵심요약집 빨간키 수록!" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">2026 시대에듀 Win-Q 전자캐드기능사 필기 단기합격 - 10년간 빈출문제로 한번에 끝내는! 2025년 최근 기출복원문제 수록! 핵심요약집 빨간키 수록!</div> <div class="related-author">정도건, 이희준 </div> </a> </div> <div class="related"> <a href="/compare.jsp?isbn=9788933610817"> <div class="related-img"><img class="lazy" data-src="/img_thumb2/9788933610817.jpg" alt="AutoCAD 2026" onerror="this.src='./img/prepare.png'"></div> <div class="related-title">AutoCAD 2026</div> <div class="related-author">유대원 </div> </a> </div> <div class="clear"></div> </div> </div> <div class="clear"></div> </div> <div class="supply-coupang">이 포스팅은 쿠팡 파트너스 활동의 일환으로,</div> <div class="supply-coupang">이에 따른 일정액의 수수료를 제공받습니다.</div> <div class="supply-coupang">이 포스팅은 제휴마케팅이 포함된 광고로 커미션을 지급 받습니다.</div> <div class="supply">도서 DB 제공 : 알라딘 서점(www.aladin.co.kr)</div> </div> <div class="clear"></div> </div> <style> .right-side { position:fixed; left: calc(50% + 600px); top: calc(25%); } #recent-list { position: relative; border: 1px solid #e3e5e8; width: 100px; max-height: 525px; z-index: 9999; border-radius: 5px; } #recent-list.on { top: auto; bottom: 204px; z-index: 1; } .right-side.on { top: auto; bottom: 150px; z-index: 1; } .view-all { margin: 2px 0 3px 5px; padding: 5px 0; font-size: 12px; font-weight: bold; } .view-all a{ color: #5d5959; } @media (max-width: 1170px){ .right-side {display: none;} .top-anchor {display: block;} } </style> <script> $(window).scroll(function() { if ($(this).scrollTop() > 500) { $('.top-anchor').fadeIn(100); } else { $('.top-anchor').fadeOut(100); } }); $(window).on('scroll resize onResize', function() { var sT = $(window).scrollTop(); var val = $(document).height() - $(window).height() - $('.copyright').outerHeight(); if(sT >= val){ $('.right-side').addClass('on'); } else { $('.right-side').removeClass('on'); } }); </script> <div class="right-side"> <div id="recent-list"> <div style="font-weight:bold; color: #528996; font-size: 14px; padding: 5px; border-bottom: 1px solid #ececec">최근 본 책</div> </div> <div class="top-anchor" style="display: none; width: 34px; height: 44px; margin-top:10px; background-image:url('./img/gotop.png'); background-size: 34px 44px; cursor:pointer;" onclick="window.scrollTo(0,0);"></div> </div> <div class="clear"></div> <!-------right-------> </section> <style> footer {height: 120px} .logo-footer {float:left; margin: 45px 30px 30px 150px;} .content-footer {margin: 20px 0px 0px 60px; float: left} .copyright {display: block; text-align: left; padding: 0px; margin: 0px 0px 15px 0px; line-height: 22px;} .footer-nav {float: left; padding:2px 0px; font-size: 14px; margin: 10px 0px 15px 0px; font-weight: bold;} .footer-nav::after {content: "|"; display: block; float: right; padding: 0px 40px; color: #d9d9d9; font-size: 13px;} .footer-nav:nth-child(3)::after {content: ""; padding: 0px;} .footer-nav:nth-child(1) {padding-left: 0px;} .footer-nav:nth-child(3) {color: #767676} @media (max-width: 1170px){ footer {border-top: 2px solid #cbeaf1;} .container .copyright {display: block; margin-left: 0px !important;} .container .logo-footer {display: none;} .container .content-footer {margin: 0 auto; width: 670px; float: none} .container .privacy {margin-top: -10px !important; font-size: 12px !important; float:none !important; text-align: center;} } @media (max-width: 800px){ .container .copyright .copyright_li {font-size: 10px; display: none;} .container .content-footer {float: right; width: 100%} .container .content-footer ul {text-align: center;} .container .content-footer .footer-nav {float: none; display: inline-block;} .footer-nav:nth-child(1)::before {content: "";} } @media (max-width: 700px){ footer {height: 60px;} .container .content-footer {width: 270px; margin: 10px auto; float: none; line-height: 10px; } .container .content-footer .footer-nav{ font-size: 11px; margin: 5px 0px; display: inline-block; float: none;} .container .content-footer .footer-nav:nth-child(2)::after{display: none;} } </style> <footer> <div class="container"> <div class="logo-footer"> <img style="width: 200px; height:27px;"src="./img/logo_left.png" alt="logo"> </div> <div class="content-footer"> <ul> <li class="footer-nav"><a href="./board/question.jsp">문의하기</a> <li class="footer-nav"><a href="./privacy.jsp">개인정보처리방침</a></li> <li class="footer-nav">Copyright 2025 BOOKPRICE All rights reserved</li> </ul> <ul class="copyright"> <li class="copyright_li">(주)인터버드 | 대표이사 : 성낙복 |  E-mail: badatime2@gmail.com<li> <li class="copyright_li">사업자등록번호: 602-81-25941 | 통신판매업 신고 번호: 2003-부산영도-0052</li> </ul> </div> <div class="clear"></div> </div> </footer><!----footer------------> </div><!--wrap--> <script> document.addEventListener('DOMContentLoaded', function () { let lazyloadImages = document.querySelectorAll('img.lazy'); let lazyloadThrottleTimeout; function lazyload() { if (lazyloadThrottleTimeout) { clearTimeout(lazyloadThrottleTimeout); } lazyloadThrottleTimeout = setTimeout(function () { let scrollTop = window.pageYOffset; Array.prototype.forEach.call(lazyloadImages, function (img,index) { if(img.offsetParent!=null){ if (img.offsetParent.offsetTop < window.innerHeight + scrollTop) { img.src = img.dataset.src; img.classList.remove('lazy'); } } }); if (lazyloadImages.length === 0) { document.removeEventListener('scroll', lazyload); window.removeEventListener('resize', lazyload); window.removeEventListener('orientationChange', lazyload); window.removeEventListener('load', lazyload); } }, 20); } document.addEventListener('scroll', lazyload); window.addEventListener('resize', lazyload); window.addEventListener('orientationChange', lazyload); window.addEventListener('load', lazyload); }); $(document).ready(function(){ $("#new_tb").on("click", "tbody .tr2", function(event){ const clickTarget = event.target.parentNode.getAttribute('onclick'); const params = {"target": clickTarget, "sid": 'BCBA853E40B264735216E2C5A1FA1A2D', isbn: '9788942909827', ua: navigator.userAgent, t: "new"} Clicker(params); }) $("#used_tb").on("click", "tbody .tr4", function(event){ const clickTarget = event.target.parentNode.getAttribute('onclick'); const params = {"target": clickTarget, "sid": 'BCBA853E40B264735216E2C5A1FA1A2D', isbn: '9788942909827', ua: navigator.userAgent, t: "used"} Clicker(params); }) $('#tab4 #innerAuthor').each(function (){ var aa= $(this).children().find("#author-info")[0].scrollHeight; var bb = $(this).children().find("#author-info").innerHeight(); if(aa > bb) { $(this).children(".authInfo-more").css("display","block"); } }); $('.authInfo-more').click(function(){ var more = $(this).parent().children().children('#author-info'); if(more.css("-webkit-line-clamp") != "3"){ more.css("-webkit-line-clamp","3"); $(this).children('.i-more').css("transform","rotate(360deg)"); $(this).children('span').text("펼치기"); } else { more.css("-webkit-line-clamp","initial"); $(this).children('.i-more').css("transform","rotate(180deg)"); $(this).children('span').text("접기"); } }); $(window).on('scroll resize onResize', function() { adjustTabFix() }); $(window).on('scroll resize onResize', function() { $('.tab-content').each(function() { if($(window).scrollTop()>=$(this).offset().top-100){ var text = $(this).children("h3").text(); $('.tab a div').removeClass('tab-select'); $('.tab a div:contains('+text+')').addClass('tab-select'); } else if ($(window).scrollTop()+1 >= $(document).height() - $(window).height()){ $('.tab a div').removeClass('tab-select'); $('.tab a div').last().addClass('tab-select'); } }); }); $('.tab div').click(function(){ var index = $('.tab div').index(this) $('.tab div').removeClass('tab-select'); $('.tab div').removeClass('tab-select'); $(this).addClass('tab-select'); $('.tab div:eq('+index+')').addClass('tab-select'); }); const totalData = { isbn: '9788942909827', ps: '16000', ca: 'ko', as: '2500', category: 'ko', tt: encodeURIComponent('인터넷 프로그래밍'), ep: '0', em: '0', el: '', at: encodeURIComponent('강준길'), yesup: 'true', kbup: 'true', evup: 'true', ypup: 'true', cpup: 'true', gmup: 'true', ysel : '', kbel : '', gmp: '0' ,gmd:'0', gms: '0', gmpo: '0', gml: '', gmcd: encodeURIComponent('') } const usedData = { isbn: '9788942909827', aic: '0', amp: '0', aul : '', uic: '0', ump: '0', uul: '', s: '980213', ps11: '0', link11: '', gmp: '0', gml: '' } if('false'!='true'){ ajaxNew(totalData); ajaxUsed(usedData); } if(document.querySelector('#amzn_assoc_ad_div_adunit0_0')!=null){ setTimeout(function(){ const oversea = document.getElementsByClassName('oversea'); const amzAds = document.getElementById('amzn-native-ad-0'); if(amzAds.style.display != 'block'){$('.oversea').html("등록된 직구도서 정보가 없습니다.");} }, 2000); } else if(document.querySelector('.oversea')!=null){ $('.oversea').html("등록된 직구도서 정보가 없습니다."); } if('false'){ } }); const adjustTabFix =function(){ if($( window ).width() > 700){ if($(document).scrollTop() >= $('.content').offset().top-100){ $('.tab').removeClass('tab-fix-mo'); $('.tab').addClass('tab-fix'); // $('header').css('height','103px'); } else { $('.tab').removeClass('tab-fix'); $('.tab').removeClass('tab-fix-mo'); } } else { if($(document).scrollTop() >= $('.content').offset().top-82){ $('.tab').removeClass('tab-fix'); $('.tab').addClass('tab-fix-mo'); } else { $('.tab').removeClass('tab-fix-mo'); $('.tab').removeClass('tab-fix'); } } } function Clicker(params){ $.ajax({ type: "post", url: "./ajax/ajax_clicker.jsp", data: params, dataType: "html", contentType: "application/x-www-form-urlencoded; charset:UTF-8", cache: true, timeout: 600000, //10분 success: function(data) { }, error: function(){ console.log("cliker error"); }, complete: function(){ } }); } document.querySelector('#book-thumb_img').addEventListener("click",(e)=>{ e.preventDefault(); let link = document.querySelector('#new_tb .tr2').getAttribute("onclick"); if(link) { link = link.substring(link.indexOf("(")+2, link.indexOf(")")-1); window.open(link); } }); document.querySelector('.detail').addEventListener("click",(e)=>{ const isbn = e.target.getAttribute("data-id"); window.open(`/img_thumb2/${isbn}.jpg`); }); </script> <script type="text/javascript" src="https://www.google.com/books/jsapi.js"></script> <script> var isbn; const checkPreview = function(booksInfo){ for (id in booksInfo) { isbn = id; if (booksInfo[id] && booksInfo[id].preview == 'partial') { google.books.load(); document.getElementById('previewBtn').style.display = 'block'; } } } document.querySelector('#previewBtn').addEventListener('click', function () { const pre = document.getElementsByClassName('previewCanvas')[0] if(pre.innerHTML == '') { document.querySelector('#loader').style.display = 'block'; preview(); } document.querySelector('.preview_box').classList.add('preview_on'); document.body.style.overflow = 'hidden'; document.querySelector('.tab').classList.remove('tab-fix'); document.querySelector('.tab').classList.remove('tab-fix-mo'); document.querySelector('header').classList.remove('header_fix'); document.querySelector('header').classList.remove('header_fix_mo'); //document.body.style.paddingRight ='15px'; }) const preview = function(){ const canvas = document.querySelector('.previewCanvas') const viewer = new google.books.DefaultViewer(canvas); viewer.load([isbn], null, previewSucc); } const previewSucc = function(viewer){ document.querySelector('#loader').style.display = 'none'; const canvas = document.querySelector('.previewCanvas') canvas.style.position = 'relative' const closeBtn = document.createElement('div') closeBtn.id = 'previewCloseBtn' closeBtn.textContent='닫기' canvas.prepend(closeBtn) closeBtn.addEventListener('click', e => {closePreviewBox()}) } const previewBox = document.querySelector('.preview_box') const closePreviewBox = function(){ previewBox.classList.remove('preview_on'); document.body.style.overflow = ''; adjustTabFix() responsive() } previewBox.addEventListener('click', (e) => { if(e.target === previewBox) closePreviewBox(); }) </script> <script src="https://encrypted.google.com/books?jscmd=viewapi&bibkeys=ISBN:&callback=checkPreview"></script> </body> <!--block:0.002--> <!--upYN:0.002--> <!--api+db:0.545--> <!--db:-1.767270513632E9--> <!--img:-1.767270513633E9--> <!--sel:0.017--> <!--series:1.767270513652E9--> <!--total:0.568--> </html>