HTML (5) 썸네일형 리스트형 [html] 젠코딩 (zen coding) * zen coding - 젠코딩은 HTML 코딩의 생산성을 향상시켜주는 도구 - eclipse, vim, dreamweaver, editplus와 같은 에디터에 플러그인으로 설치 * 문법 ID, CLASS 속성 div#page.section.main 커스텀 속성 a[title="hello world"] 엘리먼트 복제 li*3 넘버링 - $ 위치에 값이 1부터 1씩 증가 (1,2,3,4...) li.item$*3 li.item$$$*2 그룹핑 div#page>(div#header>ul#nav>li*4>a)+(div#page>(h1>span)+p*2)+div#footer ID, CLASS 앞에 태그명을 생략하면 DIV로 간주 #content>.section 텍스트 p>{click} click 예시1) di.. [html] 시멘틱 태그 태그 설명 header 사이트의 제목과 로고, 검색 창 등이 위치 nav 웹 문서 내의 메뉴 등에 사용된다. 메인페이지 - 상단주메뉴 / 서브페이지 - 상단주메뉴 또는 사이드, 중간 메뉴 footer 웹문서 하단 영역으로, 정책, 저작자나 저작권 정보 등에 사용된다. main 본문 묶음 (한페이지에 한번만 가능) section 같은 주제에 대한 내용의 묶음 article 작은 컨텐츠의 독립적 영역 aside 컨텐츠 외의 영역 * 예시 이미지 * 예시 코드 MainMenu1 MainMenu2 MainMenu3 MainMenu4 MainMenu5 비주얼 광고 영역 타이틀1 타이틀2 타이틀3 타이틀4 사이트 맵 : 은행, 증권사이트 참고 하단로고 정책1 정책2 정책3 정책4 나누는 영역 나누는 영역 나누는 영.. [html] 이미지, 링크, 엔티티(entity)코드 1. 이미지 * 확장자 jpg ( jpeg ) : 기본 png : 투명이미지 svg : W3C가 개발한 개방형 표준으로 벡터포맷유형 gif : 움짤 WebP : 구글에서 개발한 이미지 포맷 - gif, png, jpg 포맷을 대체하귀 위해 개발 * img 태그 속성 src (*) : 이미지 주소 ./ 혹은 생략 alt (*) : 대체 텍스트 - 이미지에 있는 글자 혹은 제목으로 작성 title : 대체 텍스트가 길면 alt에 간당히 적고 나머지 내용은 title에 작성 width, height : 주로 css로 처리 / px 사용 2. 폴더 경로 ./ : 현재 폴더 ( 생략가능 ) ../ : 상위 폴더 / : 최상위( 절대위치 ) 3. 링크 다른 페이지나 같은 페이지 웹주소 연결, 이메일, 내부(외부) .. [html] 기본 작성법 및 주요 태그 * 작성법 - 파일 - 폴더열기 - 저장폴더 선택 - 왼쪽 메뉴에서 폴더 마우스 우측 또는 상단 아이콘 새 파일 - 파일명. html -!, 또는 html5 엔터 또는 탭 - 기본 템플릿 구조 생성 - title에 내용 입력, body에 작성 위 영상 참고 - 마우스 우측 - Open with Live Server - 기본 브라우저 ( 크롬 ) 결과 확인 * 주요 태그 1. 제목 ( Heading ) 요소 - h1 ~ h6 Heading의 h 문서나 구분된 영역의 제목을 나타냄 숫자가 낮을수록 중요한 제목 제목 : h1~h6 -> 중요도 h1 : 웹사이트 로고 부분 문서상으로는 section 안에 h1 사용가능 공식적으로 웹사이트에 제목 한번만 사용 권장 h2~h6 : 여러번 사용 가능 한 컨텐츠 영역에.. 컴퓨터 기본 지식 (작동법/http/도메인/호스팅) 1. 인터넷 작동 원리 - 브라우저의 핵심 기능은 사용자가 참조 및 사용하고자 하는 웹페이지를 요청 받은 내용에 따라 브라우저 화면에 표시하는 일 - 해당 과정 중 자바스크립트가 중간에 넣어질 경우 모든 과정은 중단하고 자바스트립트가 우선적으로 작동되기 때문에 반드시 자바스트립트는 body 끝나는 지점에 삽입 2. HTTP / 도메인 ✔ HTTP - HTTP (Hyper Text Transfer Protocol), 하이퍼텍스트 전송 프로토콜 -> HTTP는 서버와 클라이언트가 서로 데이터를 주고받기 위해 사용되는 통신 규약 클라이언트 ------ 요청 (request) -----> 서버 클라이언트 이를 보완하기 위해 Cookie와 같은 기술이 등장 - 인터넷 주소를 지정할때 http://www.~~~ 와.. 이전 1 다음
