나는 엔지니어/HTML 썸네일형 리스트형 내가 작성한 HTML이 표준을 만족하는가????? ㅡㅡa 명언 : 고객은 하늘 아래에 있는 모든 브라우저를 사용한다. .내가 작성한 페이지가 표준으로 작성되어 있는지 체크 해주는 사이트http://validator.w3.org/ .두가지 DOCTYPE.transitional : 이전 버전 HTML의 일부분도 허용 .strict : 엄격한 문서 타입 ( 완벽한 신뢰성과 표준화된 웹 사이트임이 검증 ) .표준 엘리먼트 위치에 관해서1) Body 안에는 블록 엘리먼트만 넣는다.2) 모든 인라인 엘리먼트와 텍스트는 다른 블록 엘리먼트 안으로 들어가야 한다.3) 인라인 엘리먼트 안에 넣을 수 있는 유일한 것은 텍스트나 다른 인라인 엘리먼트들이다. ( 블록 엘리먼트는 어떤 상황에서라도 인라인 엘리먼트 안으로 들어가는 것이 허용되지 않는다. )4) 블록 엘리먼트들은 엘리먼.. 더보기 img 태그에 관해서 이미지 태그. 웹 페이지를 작성하다 보면 아래와 같은 이미지 태그를 자주 사용하게 된다. 브라우저는 어떤 순서로 이미지를 보여줄까? 아래의 그림을 보면 순차적으로 하나씩 하나씩 브라우저가 체크 하고 서버에 요구하여 받아내고 있는걸 알 수가 있다. 만약 이미지 파일이 많다면 당연히 속도는 떨어질 것이다 ( 어떤 브라우저는 이미지 파일을 다 받은후 한번에 표시하기도 한다. ) 종류 JPEGGIF png 이미지 종류 사진 같은 이미지 단색 / 로고 / 클립아트 / 텍스트 JPEG와 GIF 모두를 지원 표현 가능 색 1600만 개의 색 표현 256개의 색 표현 압축 손실 압축 : 약간의 정보를 버리고 파일 크기를 감소 무손실 압축 : 사이즈를 줄여 압축될 수 있으며아무것도 버리지 않는다. 투명도 지원 안함 가능.. 더보기 새 윈도우 열기... 태그를 이용하여 페이지 이동을 할 경우 새 윈도우를 표시(팝업)해야할 경우가 비번히 발생하는데이럴땐 태그의 속성을 다음과 같이 변경해 주어야 한다. 대상 속성의 이름 : target ex) page move test target의 속성값을 _blank로 설정하면 항상 새 윈도우를 표시하는데,만약 같은 페이지를 새 윈도우로 오픈한 이후엔 다시 열지 않도록 하기 위해선 이름을 지정해 주어야 한다.아래와 같이! page move test 더보기 목적지 앵커 설정 하는법 목적지 앵커란?파일 링크를 실시 했을때 해당 웹 페이지의 특정한 부분에 포커스를 맞출려고 할때 사용하는 듯 하다.예를 들어서 아래의 코드를 한번 살펴보자. [ex-01: test.html] chai tag move ......... Chai Tea, 1.85 A spicy drink made with black tea, spices, milk and honey. 즉 한페이지 내에서 특정 태그로의 이동을 할 경우에 사용하는 기능을 목적지 앵커라고 한다.목적지 앵커는 해당 페이지 이름 뒤에 # 을 붙히고 다음에 ID를 붙히면 된다. [추가 사항]. 목적지 앵커는 동일 페이지가 아니라 특정 페이지의 링크를 실시할 경우 해당 페이지의 특정 부분을 가리킬때 씀 ( 보통 페이지 이동이 발생하면 페이지의 TOP이 표.. 더보기 HTML&CSS-01 웹 페이지의 구조를 브라우저가 알 수 있도록 하기 위해서,마크업 언어를 사용한다.그럼 마크업 언어인 HTML을 시작하기 전에 먼저 마크업의 구성을 잠시 살펴보자. .형태엘리먼트 : 콘텐츠(내용) 그럼 CSS란? Cascading Style Sheets의 약자이고, 웹페이지에 있는 각각의 엘리먼트들이 어떻게보여져야 하는지를 브라우저에게 알려주는 역할을 수행한다. 아래는 CSS 적용전과 적용후의 웹 페이지를 비교한 모습이다. (적용전 : 출처 헤드퍼스트 HTML ) (적용후 : 출처 헤드퍼스트 HTML ) 즉,CSS를 이용하면 padding / margin / background-color / border / font-family 와 같은 속성을 설정할 수가 있다. HTML과 CSS의 역할을 구분한다면 HT.. 더보기 이전 1 2 다음
