반응형

코딩일지 -언어공부방/HTML 31

HTML Colors | 색상

HTML 색상은 미리 정의된 색상 이름을 사용 하거나, RGB, HEX, HSL, RGBA, HSLA와 같은 value 값을 사용한다. HTML은 140가지의 스탠다드 컬러를 제공한다. Background 컬러 설정 style 값 사용. style="background-color : Color name;" 텍스트 컬러도 변경 가능하다. style="color : Color name;" Border color 테두리 색상도 지정 가능하다. style="border : 2px solid Color-name;" ​ RGB Color value는 Red, Green, Blue를 의미하는데, 0에서 255까지 표현된다. 이 의미는 Red 에서 256가지, Green에서 256가지, Blue 에서 256 가지. 총..

HTML Comments | 주석 표시

HTML 코멘트(주석)는 브라우저에 표시되지는 않지만, 소스 코드는 문서화 하는데 도움 될 수 있다. 주의할 점은, 느낌표는 (!) 시작태그로만 사용되고, end tag로는 사용되지 않는다. 파이썬에서 # 처리하고 주석 표시하는것과 비슷. 의 형태. HTML을 디버깅 할때도 유용하다. 오류를 찾을 때, 하나씩 주석처리 해놓고 실행 시켜볼 수 있으므로. 중간 부분만 주석처리 하는것도 가능하다.

HTML Quotation | 서식태그 | 인용태그

태그는 원하는 문구를 인용문으로 정의하기 위해 사용 한다. 인용문으로 지정이 되면, 브라우저는 일반적으로 들여쓰기로 표현이 된다. 속성으로는 'cite'를 가지고 있으며, 인용문의 URL 소스를 지정할 수 있다. 태그는 쌍 따옴표로 감싸주는 태그이다. 태그는 "HTML", "CSS", "Mr.", "Dr.", "ASAP", "ATM" 과 같은 약어 또는 두문자어를 정의한다. 태그는 브라우저와 번역 시스템 및 검색엔진에 유용한 정보를 제공한다. title 속성을 이용하여, 해당 태그 문구 위에 마우스를 올려 놓을 때 대체 텍스트가 나타나게 할 수도 있다. ​ 태그는 문서 또는 기사의 작성자/소유자에 대한 연락처 정보를 나타내는 태그이다. 연락처 정보는 이메일 주소, URL, 실제 주소, 폰번호, SNS주소..

HTML Styles 사용해서 꾸미기

Style 속성은 다음과 같은 형식을 띈다. ​ 여기서 property는 CSS의 value 특성을 의미한다. CSS background-color 특성은 HTML 배경화면의 색을 지정하는 태그이다. Body 뿐만 아니라, 이런식으로 Heading(제목)이나 Paragraph(단락)에서 글자 배경 색을 지정해줄 수도 있다. CSS의 color 특성을 이용해 텍스트 컬러도 지정해 줄 수 있다. CSS의 font-family 특성을 이용해 글꼴도 지정 할 수 있다. CSS의 font-size 특성을 이용해 텍스트 사이즈도 지정 할 수 있다. CSS의 text-align 특성을 이용해, 정렬 위치를 지정할 수 있다.

HTML Paragraphs 단락

- 단락 단락은 항상 새 줄(new line)에서 시작한다. 웹브라우저는 자동적으로 단락의 앞뒤로 빈 줄을 삽입한다. 와 사이에 있는 텍스트는 줄바꿈을 하든. 띄어쓰기를 하든. 웹브라우저는 이를 무시하고 출력한다. 브라우저는 페이지가 표시될 때, 추가 공백과 줄을 자동으로 제거한다. 고로, HTML이 어떻게 표시될지 확신할 수 없다..... 태그는 주제별로 구분을 정의하며, HTML 페이지에서 콘텐츠를 분리(또는 변경) 하는데 사용 된다. 태그는 단독으로 쓰이는 empty 태그다. Line을 바꿀 때는 태그를 사용한다. (줄바꿈) 마찬가지로, 단독으로 쓰이는 empty 태그다. ex) This isa paragraphwith line breaks. 태그는 미리 형식이 지정된 텍스트를 정의한다. 태그 안의..

HTML Headings 제목

​ Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Heading은 웹사이트의 title이나 subtitle을 의미한다. Heading은 Heading으로만 사용되어져야한다. text를 크게/굵게 효과를 주는 것을 사용하면 안된다. 검색엔진은 제목을 사용하여 웹페이지의 구조와 내용을 색인화 하기 때문이다. 각각의 HTML 제목은 사이즈가 default 값으로 정해져 있다. 그러나, style 속성을 이용하면 (CSS의 font-size 특성을 이용) 변경이 가능하다. ex) Heading 1

HTML Attributes 속성

속성은 HTML 태그들에 대한 추가 정보를 제공하는 역할을 한다. → 모든 HTML 태그들은 속성을 가질 수 있다. → 속성은 항상 start tag 에서 지정된다. → 속성은 항상 다음과 같은 형식을 띈다 : name = "value" example) 강코딩의 블로그 href 속성 → 태그는 하이퍼링크로써, href 속성을 가지며 기능은 페이지의 URL을 표시한다. src 속성 → 태그는 HTML 페이지에 이미지를 삽입하는데 사용되고, src 속성은 표시할 이미지의 경로를 지정한다. → example ) → url 이 슬래쉬가 포함되지 않은 이미지 url을 사용하는 것이 좋다. 외부 url은 대게 슬래쉬(/)가 포함되는데, 이는 외부 사이트에서 가져온 url을 의미한다. 저작권 문제가 생길수도 있고 외..

HTML Basic 기본 골격 구조

모든 HTML 문서들은 반드시 으로 시작한다. → 문서 유형을 나타내며, 브라우저가 웹페이지를 올바르게 표시하도록 도와준다. → 태그는 대소문자를 구분하지 않는다. → 맨 위에 한번만 쓴다. HTML 문서는 으로 시작해 으로 끝난다. 보여지는 (visible) 부분의 HTML 문서 태그는 와 안에 담긴다. ​ → HTML 제목 태그는 에서 로 표시 된다. → 태그는 가장 중요한 제목에 사용하고, 태그는 가장 덜 중요한 제목의 태그로 사용된다. ​ → 서술 태그는 태그로 정의된다. → 로 시작해서 로 닫힌다. ​ → HTML 링크는 태그로 정의된다. → 태그에서 속성은 href 를 사용한다. ​ → HTML 이미지는 태그로 정의된다. → 소스 파일 주소는 src 속성을 사용하고 → 사진에 마우스를 가져다 ..

반응형