본문 바로가기

Python_WEB/HTML

(149)
HTML5 - 190615 Basic Study 37(롤 오버 효과 주기) 1. HTML Code 롤오버 효과주기 daum 다음 naver 네이버 nate 네이트 다음 daum 네이버 naver 2. CSS Code @charset "utf-8"; /* CSS Document */ *{ margin:0; padding:0; } body{ font-family:sans-serift, "맑은 고딕"; font-size:14px; color:black; } ul, li{ list-style:none; } a{ text-decoration:none; color:black; } /* 롤오버 효과주기 */ dl dt,dl dd{ float:left; width:80px; height:50px; border:1px solid red; } dl dd{ display:none; } dl dt:..
HTML5 - 190615 Basic Study 36(가로 네비게이션 바) 1. HTML Code 가로네비게이션 바 지역 쇼핑 문화 여행 레저 추천 전체보기 2. CSS Code @charset "utf-8"; /* CSS Document */ *{ margin:0; padding:0; } body{ font-family:sans-serift, "맑은 고딕"; font-size:14px; color:black; } ul, li{ list-style:none; } a{ text-decoration:none; color:black; } /* 가로네비게이션 */ ol{ overflow:hidden; width:1000px; } ol li{ width:140px; height:50px; background:url(../img/top_gnb1-1.png); /* 글자숨기기 */ text..
HTML5 - 190615 Basic Study 35(스프라이트 메뉴) 1. HTML Code 스프라이트 메뉴 템플릿 워드프레스 맞춤솔류션 주문제작 무료홈페이지 2. CSS Code @charset "utf-8"; /* CSS Document */ *{ margin:0; padding:0; } body{ font-family:sans-serift, "맑은 고딕"; font-size:14px; color:black; } ul, li{ list-style:none; } a{ text-decoration:none; color:black; } /* 가로크기-116px 세로크기-38px */ nav ul{ overflow:hidden; width:600px; } ul li{ width:116px; height:38px; background:url(../img/css_sprites-1..
HTML5 - 190615 Basic Study 34(배경 속성 이해하기) 1. HTML Code 배경 속성 이해하기 box1 box2 box3 box4 box5 box6 box7 2. CSS Code @charset "utf-8"; /* CSS Document */ /* CSS 초기화 */ *{ margin:0; padding:0; } body{ font-family:sans-serif, "맑은 고딕"; font-size:14px; color:black; } ul,li{ list-style:none; } a{ text-decoration:none; color:black; } div{ width:300px; height:300px; border:3px solid red; } #box1{ /* bgc : 젠코딩 */ background-color:pink; } #box1{ bac..
HTML5 - 190615 Basic Study 33(Sitemap 제작 - 3) 1. Sitemap 사이트의 설계도. 크롤링 로봇이 이용할 수 있는 웹사이트의 접근 가능한 페이지의 목록. 2. HTML Code 사이트맵 회사소개 출판이념 회사연혁 찾아오시는길 신간소개 디카 그래픽 오피스 ITQ 경영/경제 기타 도서소개 디카 그래픽 오피스 ITQ 경영/경제 기타 영상강좌 디카 그래픽 오피스 ITQ 경영/경제 기타 자료실 디카 그래픽 오피스 ITQ 경영/경제 기타 고객마당 공지사항 1:1 게시판 3. CSS Code @charset "utf-8"; /* CSS Document */ body { background:#FFF; color:#333; font-size:0.75em; font-family:맑은 고딕, 돋움, sans-serif; margin:0; line-height:1.5em..
HTML5 - 190609 Basic Study 32(Note) html강좌 19번게시판 link:css -> ctrl+e 기본글자크기 16 -> 14로 변경하면 16/14 = 0.875 14px 이면 14*0.875 = 12.25 a태그는 글자 색 상속이 안된다. 테두리, 마진, 패딩 등은 자동 상속이 안되고 수동 상속을 해야된다. 스타일 우선순위는 스타일을 중복 선언시 적용되는 우선 적용되는 순위가 있다. 1) 마지막에 입력한 스타일이 적용된다. 태그선택자 1점 / ul li 2점 / 클래스선택자. 10점 / li.abc 11점 / ul li.abc 12점 / 아이디선택자 100점 / li#abc 101점 / ul>li#abc 103점 / 인라인스타일 1000점 !important 만점 제이쿼리로 스타일을 변경하면 인라인스타일로 코드가 입력된다. 상속과 우선순위 ..
HTML5 - 190609 Basic Study 31(가시 속성) 1. HTML Code 가시 속성 콘텐츠를 숨기는 원리 버튼만들기 버튼 welcome to my world 무공화꽃이 피엇습니다 다람쥐 가오리 안녕하세요 감사합니다. 돌아가기 box1 100+(10+10+10)*2 box2 100+10*2 box3 box4 2. CSS Code @charset "utf-8"; /* CSS Document */ *{ margin:0; padding:0; } a{ text-decoration:none; } #btn{ width:100px; height:80px; background:gold; margin:30px; text-align:center; line-height:80px; border-radius:20px; } #btn a{ background:pink; displa..
HTML5 - 190609 Basic Study 30(Sitemap 제작 - 2) 1. Sitemap 사이트의 설계도. 크롤링 로봇이 이용할 수 있는 웹사이트의 접근 가능한 페이지의 목록. 2. HTML Code sitemap TOEFL TOEFL 시험 소개 TOEFL 프로그램 소개 TOEFL 강의 시간표 TOEFL 등록 문의 TOEFL 수업 후기 TOEFL 강사 소개 TOEIC TOEIC 시험 소개 TOEIC 프로그램 소개 TOEIC 강의 시간표 TOEIC 등록 문의 TOEIC 수업 후기 TOEIC 강사 소개 ENGLISH ENGLISH 프로그램 소개 ENGLISH 강의 시간표 ENGLISH 등록 문의 ENGLISH 수업 후기 ENGLISH 강사 소개 JAPANESE JAPANESE 프로그램 소개 JAPANESE 강의 시간표 JAPANESE 등록 문의 JAPANESE 수업 후기 JA..