태그 속성 설명 href 링크한 문서나 사이트의 주소 지정 target 링크한 내용이 표시될 위치(현재 창 또는 새 창)를 지정 download 링크한 내용을 보여주는 것이 아니라 다운로드 rel 현재 문서와 링크한 문서의 관계를 알려줌 hreflang 링크한 문서의 언어 지정 type 링크한 문서의 파일 유형을 알려줌 href 속성 - 링크만들기 태그의 href속성을 사용해 링크, 앵커이름앞에 #을 붙여 앵커임을 표시 - jQuery Mobile을 이용해 모바일 웹사이트나 웹앱을 만들 때 자주 사용 텍스트 또는 이미지 텍스트 또는 이미지 예시 앵커 만들기 앵커란?~~ 메뉴1 메뉴2 메뉴3 내용1 1-1 1-2 1-3 [메뉴로] 내용2 2-1 2-2 2-3 [메뉴로] 내용3 3-1 3-2 3-3 [메뉴로]

웹에서 사용할 수 있는 이미지 파일 형식 파일형식 설명 GIF(Graphic Interchange Form) 파일 크기가 작음 아이콘이나 불릿 등 작은 이미지에 주로 사용 투명한 배경이나 움직이는 이미지 만들 수 잇음 JPG/JPEG (Joint Photographic Experts Group) 다양한 색상과 명암표현 but 저장 반복시 화질 저하 PNG(Portable Network Graphics) 투명 배경을 만들면서 다양한 색상 표현 가능 네트워크용으로 개발 -> 多 사용 태그 - 이미지 삽입하기 - src 속성을 사용해 이미지 파일이 있는 경로를 알려주어야 화면에 이미지 표시 가능

, , , 태그 - 기본적인 표 만들기 1. 태그를 이용해 표 전체 윤곽 잡기 2. 태그로 원하는 개수의 행을 만들기 (2개의 행 예시) 3. 태그로 각 행마다 셀을 원하는 개수의 열을 만들기 (3개의 열 예시 ) ... ... ... ... ... ... 4. 각 셀에 들어갈 내용은 와 사이에 입력 하기 태그 - 표에 제목 셀 만들기 첫 번째 행이나 열에 셀의 제목을 넣는 경우 대신 태그 이용 : 다른 글자보다 굵게 표시하고 셀의 중앙에 배치 colspan, rowspan 속성 - 행 또는 열 합치기 colspan : 열 합치기 (가로로 합치기) rowspan: 행 합치기 (세로로 합치기) 내용 내용 내용 내용 예시 이름 연락처 주소 자기소개 태그, 태그 - 표에 제목붙이기 1. 태그 사용 제목이 중앙..

태그, 태그 - 순서없는 목록 만들기 (unordered list, list item의 줄임말) 순서가 필요하지 않은 목록을 만들때 태그 사용하고, 태그 안에 태그를 사용해 각 항목 표시 순서 없는 목록 : 각 항목 앞에 작은 원이나 사각형 같은 불릿(bullet)이 붙음 CSS의 list-style-type 속성을 이용해 bullet 수정 가능 내용1 내용2 ... 태그, 태그 - 순서목록 만들기 (ordered list의 줄임말) 순서가 필요한 목록을 만들 때 태그 사용하고, 태그 안에 태그를 사용해 각 항목 표시 태그 : 여러 속성이 함께 사용됨 -> 목록의 숫자 표기 방법이나 시작하는 숫자 등 변경 가능 (1) type 속성 : type 속성을 이용해 숫자의 종류를 다양하게 조절 가능 속성값 설명..

텍스트를 덩어리로 묶어 주는 태그 태그 – 제목 표시하기 (heading의 줄임말) (가장 큰 제목) ~ (가장 작은 제목) 제목 태그 – 단락 만들기 (paragraph의 줄임말) 텍스트 태그 – 줄 바꾸기 (break의 줄임말) 태그 – 분위기 전환을 위한 수평 줄 넣기 (horizontal의 줄임말) 을 이용하면 가로선이 삽입되는데 CSS로 제거 가능 태그- 인용문 넣기 다른 블로그나 사이트의 글을 인용한 경우 사용 인용내용 태그 – 입력하는 그대로 화면에 표시하기 (preformat의 줄임말) 소스에 표시한 공백이 브라우저에 그대로 표시됨 cf) 웹문서를 소리로 읽어주는 기꼐 나 점자로 표시해주는 기계는 태그가 적용된 부분을 만나면 건너뜀 텍스트 02-2 텍스트를 한 줄로 표시하는 태그 태그, 태..

(예전에 올린 Do it! HTML 5+CSS 1강 -2 ) 호스팅 서버 준비하기 HTML로 만든 웹문서를 모두 서버 컴퓨터로 옮겨야 만든 웹사이트 내용을 다른사람이 볼 수 있음 서버 호스팅 서비스 = 웹 호스팅 서비스 : 서버의 일부 공간을 매달 또는 몇 년 마다 일정 금액을 내고 사용하는 서비스 웹 호스팅 서버 : 윈도우 서버 호스팅 ( ASP, ASP.NET 프로그래밍 언어 사용) 리눅스 서버 호스팅 (PHP 프로그래밍 언어 사용) 무료 웹 서버 공간 이용! - 1년간 무료로 사용할 수 있고 1년이 지나면 연장 신청을 해야 무료로 이용가능 닷홈사이트 https://www.dothome.co.kr/ 닷홈 - 호스팅은 닷홈 닷홈은 무제한 웹호스팅, 무료호스팅, 도메인, 홈페이지빌더, 무제한메일, SSL..

(예전에 올린 Do it! HTML 5+CSS 1강 -2 ) 태그란(tag)? 마크업할 때 사용하는 약속된 표기법 1. 를 이용해 구분 - 이미지 삽입 : 'image'의 약자 - 텍스트 문단 삽입 : 'paragraph'의 약자 2. 소문자로 사용 (권장) 3. 여는 태그, 닫는태그 정확히 입력 ex) 여는태그 ~ 닫는태그 (웹브라우저는 여는 ~닫는까지 태그 적용범위로 인식) 예외) 태그는 닫는 태그가 없음 4. 적당히 들여쓰기 - 여러 번 띄어쓰기를 하더라도 한칸의 공백으로 인식 -> Tab을 이용해 소스 들여쓰기 할 것 5. 태그에 여러 기능을 추가하는 속성과 함께 사용 가능 - 형태로 사용 가능 - ex) 갈색 부분: 속성, 초록색 부분: 속성값 6. 포함관계를 명확히 함 - 한 태그 안에 ..

일반문서 vs 웹문서 일반문서 : 내용을 입력하는 프로그램과 나중에 그 내용을 확인하는 프로그램 동일 웹문서 : 웹문서를 작성하는 프로그램(web editor), 웹문서를 보는 프로그램(web browser) HTML 이란? (HyperText Markup Language) 'HyperText' : 웹 사이트에서 링크를 클릭해 다른 문서나 사이트로 즉시 이동할 수 있는 기능 'Markup' : 태그(tag)를 사용해 문서에서 어느 부분이 제목이고 본문인지, 어느부분이 사진이고 링크인지 표시하는 것 HTML : 웹에서 자유롭게 오갈 수 잇는 웹문서를 만드는 언어 웹표준 이란? 웹 사이트를 만들 때 지켜야 하는 약속들을 정리한 것 장소나 브라우저와 상관없이 쉽게 웹사이트를 볼 수 있고 웹 개발자와 디자이너들..