WEB/HTML (23) 썸네일형 리스트형 HTML 문서 - 구성 요소 HTML 문서의 구성 요소 : 하나의 HTML 문서는 다양한 요소들의 조합으로 구성 요소 - 내용 : 속성 HTML 웹프로그래밍 요소는 기본적으로 시작태그와 종료태그는 하나의 쌍을 이루는데 경우에 따라서는 종료태그없이도 사용되는 태그도 있다. ,, 등 전역 속성 : 속성인데 글로벌하다는 의미( 모든 태그에서 사용이 될 수 있다.) class, id, style,lang, title 등 HTML 문서 작성 시 주의사항 1. 태그는 대소문자를 구분하지 않지 않지만 소문자 표기를 권고 한다. 2. 파일의 확장자는 반드시 htm, html로 지정 ( 파일명.htm or 파일명.html) 3. 화이트페이스는 입력한 의도대로 적용되지 않음 -> 두 칸 이상의 연속된 공백은 하나의 공백으로 처리됨 3. 요소 안에 다.. 태그 (열린태그) (끝 태그) 웹으로 실행하기위해서는 항상 htdocs에 파일을 저장해야한다. HTML 실습 - 사이트 완성 HTML 실습1 :모델링을 HTML로 만들기 : 대제목 (1~6) 이 태그로인해서 화면상에서 표시되는 모습이 달라지는 것은 없지만 nav이라고 하는 약속되어 있는 태그를 쓰는걸 통해서 누가봐도 저 내부 안쪽에 있는 부분이 이 웹사이트를 탐색하는데 사용되는 정보라는 것을 이해할 수 있게된다. 간판과 같은 역학을 하는 태그 이 문서에서의 본문이구나라는 것을 알 수 있는 태그 활용 List [리스트를 쓸 때] html li는 list의 약자이다. ▼ 자 그런데 여기서 문제 ! 우리가 배워야할 수업들의 리스트를 화면에 표시하고, 그리고 수업을 참여하는 사람들의 이름들을 열거한다고 한다면 시각적으로 각각 그룹화가 되어서 위에는 수업, 밑에는 참여자들로 구분이 되어야한다면 어떻게 해야할까 ? ul 태그를 활용하자 한번 직접 해보자! ul == unordered list 순서가 없는 리스트라는 의미 그럼 반대로 순서가 있는 리스트도 있을까? 있다. 그것은 바로 ol이다. 라는 것은 웹페이지에서 본문에 해당되는 내용 들이 안에 있어야 한다. 이문서를 설명하는 정보들을 감싸고 있는 태그이다. utf-8 -> 이것을 안쓰면 한글이 깨지는 일이 생긴다. 문서의 제목이 바뀌는 것을 알 수 있다. 이 모든것.. HTML 속성 링크를 통하여 해당 문서로 이동하게 하고 싶을때 a 태그를 활용한다. 생활코딩 a태그를 보았다면 아 어딘가에 링크가 걸려있구나라는 것을 알 수 있다. 하지만 a태그만으로는 생활코딩을 링크로 표현하기에 부족한 부분이 있다. 왜그럴까? 어디에 링크가 걸려야 되는가? 어떠한 문서에 연결되어있는가에 대해서는 여기에서는 기술하고 있지 못하기 때문이다. a는 그냥 생활코딩이 링크라는 것만 알려줄 뿐이지 저것이 어디에 링크되어 있는지는 알려주지 않기 때문이다. 자 그때 사용하는 문법적 요소가 바로 속성이라는 것이다. 생활코딩 a 태그는 같은데 href="http://opentutorials.org/course/1" 이 부분이 추가가 되면 웹브라우저는 비로소 생활코딩이라는 텍스트가 링크라는 사실과 http://open.. HTML 개요 HTML 웹 페이지를 작성하기 위한 가장 기본적인 언어 문서 안의 정보가 어떻게 구조화되었는가를 지정하는 언어 Hypertext : 문서와 문서가 링크로 연결되어 있다. 웹페이지는 어떤 링크를 누르게 되면 다른 문서로 넘어가게 되죠? 바로 그런 형태의 문서 시스템을 HyperText라 한다. (HyperText를 고안한 사람 - Tim Berners-Lee) html이라 하는 언어에서 가장 중요한 것은 Hypertext라는 특징이다. 다른 말로는 링크라고 볼 수 있다. 링크를 인해서 문서와 문서가 그물망처럼 연결돼서 링크로 연결된 하나의 거대한 정보 덩어리가 된 것이 바로 WEB이라 할 수 있다. 그래서 링크는 HTML의 본질이라 할 수 있고 HTML의 본질은 웹의 본질이라 할 수 있다. 특징 W3C에 .. 이전 1 2 3 다음
