개발 썸네일형 리스트형 [HTML] 이미지 표현 / 동영상 / 음악 / 멀티미디어 / Tag 1. 이미지 (WebPage에 이미지를 삽입하는 경우, img tag를 사용한다) - - attribute Description src 이미지 파일 경로 alt 이미지 파일이 없을 경우 표시되는 문장 width 이미지 너비 (CSS에서 지정하는 것이 일반적) height 이미지 높이 (CSS에서 지정하는 것이 일반적) 2. 미디어 2.1 adio - attribute Description src 음악 파일 경로 preload 재생 전에 음악 파일을 모두 블러올 것인지 지정 autoplay 음악 파일을 자동의 재생 개시할 것인지 지정 loop 음악을 반복할 것인지 지정 constols 음악 재생 도구를 표시할 것인지 지정. 재생 도구의 외관은 브라우저마다 차이가 있다. - 웹브라우저 별로 지원하는 음악 파.. 더보기 [HTML] Table (tag, attribute) tag Dscription table 표를 감싸는 태그 tr 표 내부의 행 (table row) th 행 내부의 셀 (table heading) td 행 내부의 일반 셀 (table data) attribute Description border 표 테두라 두께 지정 rowspan 해당 셀이 점유하는 행의 수 지정 colspan 해당 셀이 점유하는 열의 수 지정 더보기 [HTML] 목록 List /<ul> / <ol> / <il> unorder List (순서없는 목록) 순서가 없 찌롱 - 순서가 - 없 - 찌롱 Ordered List (순서있는 목록) 순서가 있 찌롱 1. 순서가 2. 있 3. 찌롱 type (순서를 나타내는 문자 지정 가능) ex) "1", "A", "a", "I", "i" 숫자가 지정되어 이찌롱 start (리스트 시작값 지정 가능) 숫자가 지정되어 이찌롱 -> 3부터 시작 (3,4,5 요렇게) reversed (순서가 역으로 나옴) 숫자가 지정되어 이찌롱 -> 3,2,1 이렇게 나옴 더보기 [HTML] Hyperlink 정리 HyperLink (한 텍스트에서 다른 텍스트로 건너뛰어 읽을 수 있는 이 기능) - HyperText의 Hyper는 컴퓨터 용어 - 텍스트 등의 정보가 동일 선상에 있는것이 아니라 다중으로 연결되어 있는 상태를 의미 - HTML의 중요 특징 link의 개념과 연결되는데 기존 문서나 텍스트의 선형성, 고정성 제약에서 벗어나 사용자가 원하는 순서대로 원하는 정보를 취득할 수 있는 기능을 제공 - HTML link는 hyperlink를 의미하며 a(anchor) tag가 그 역할을 담당한다. -> 실행 시, Visit google.com! text click하면 google 화면으로 간댜~ 1. Href attribute (이동하고자 하는 파일의 위치를 값으로 받는다.) 2. Directory 루트 디렉터리.. 더보기 [HTML] Text 관련 Tag / 특수문자 글자 크기(1에서 6으로 갈수록 작아짐) bold체 의미론적(Semantic) 중요성 없음 bold체 의미론적(Semantic) 중요성 있음 Italic체를 지정한다. 의미론적(Semantic) 중요성 없음 강조, 중요한 text 지정 의미론적 중요성 있음 특정 글자 작게 나오게 하기 가운데 줄긋기 밑줄치기 text 위로 올리기 text 밑으로 내리기 단락(Paragraphs) 지정 텍스트 단락을 만들며 앞뒤에 줄바꿈이 있는 텍스트 덩어리를 말함 만약 웹페이지 창의 너비보다 길어질 경우 자동 줄바꿈이 일어남 강제 개행 연속적 공백 태그 내의 content 작성된 그대로 브라우저 표시 HTML은 연속적으로 공백을 많이 넣더라도 한개의 공백만 표시되지만 pre tag는 그대로 표시됨 수평줄 삽입(점.. 더보기 [HTML] 웹페이지를 구성하는 기본 tag 1. 문서 형식 정의 tag - 1. html tag - html 태그는 모든 HTML요소의 부모요소 이며 웹페이지에 단 하나만 존재 - lang attribute 사용하는 경우 많음. ko는 한국어를 주 언어로 사용하는 경우 2. head tag - head 메타데이터를 포함하기 위한 요소 - 웹페이지에 단 하나만 존재 - HTML 문서의 title, style, link, script에 대한 데이터는 화면에 표시 안됨 - head에는 메타데이터 이외의 화면에 표시되는 일체의 요소를 포함시키지 않음 1번 head에 들어가는 메타데이터들(User에게 보여지지 않는곳) 1. title tag 2. style tag 3. link tag (외부 리소스와의 연계정보 : 주로 HTML과 외부 CSS파일 연계) .. 더보기 [HTML] 시멘틱 태그 (Semantic Web) 란??? / Semantic tag 들어가기 - HTML5의 큰 특징중 하나이다! - 시멘틱 요소는 자신의 의미를 브라우저와 개발자 모두에게 명확하게 설명한다. (w3schools.com) - 검색엔진이 HTML을 분석할때 정확하게 컨텐츠를 식별하기 위해 정한 규약이다. 시멘틱 요소들을 쓰는 이유는 다음 글을 읽어 보고 대화를 나누자 ㅋ -------------------------------------------------------------------------------------------------------- "나는 검색된다. 고로 존재한다.” - 검색엔진은 이 시대의 가장 강력한 권력 중의 하나다. SEO(검색엔진 최적화: Search Engine Optimization) - 같은 마케팅 도구를 사용해 검색엔진이 본인의 웹사.. 더보기 [HTML] 기본문법 1.HTML(HyperText Markup Language) - Web의 가장 기본이 되는 언어로 " Hyper Text Markup Language" 의 줄인말이다. - 웹페이지를 기술하기 위한 마크업 언어 - 웹페이지의 내용(content)과 구조(structure)을 담당하는 언어로써 HTML 태그를 통해 정보를 구조화 하는것 - HTML은 태그로 이루어진 언어이며 태그는 으르 끝나는 구조를 가지고 있다. 2. - HTML5 문서는 반드시 으로 시작하여 문서형식(document type)을 HTML5로 지정한다. HTML5 HTML4 HTML4까지의 문서 타입은 복잡하고 길이가 길었으니 HTML5가 등장하며 간편하게 바뀌었다. 3. - 실제적인 HTML document는 2행부터 시작되는데 과 사이.. 더보기 이전 1 2 3 4 5 다음
