WEB 1 - HTML & internet
- 글자 강조
- 단락 나누기
- 태그와 속성
- 목차와 부모태그
- 문서의 구조
- 주소창 연결
HTML : HyperText Markup Language
1.글자 강조
< > 텍스트 < / >
1)제목 : H1 ~ H6
Headline. 글자 크기 + 굵은 글씨. 숫자가 작을수록 커짐.
주소창 연결
2)굵은 글씨 : strong
3)밑줄 : u (Underline)
2.단락 나누기
1)줄바꿈 : br (line break)
닫는 태그X 연달아 쓰면 줄간격이 넓어짐.
2)문단 : p(Paragraph)
닫는 태그O css 쓸 때 여백 크기 조절 가능. html만 보고도 같은 문단인지 알 수 있음.
3) tap 키
태그x 사이트에는 반영되지 않으나 편집기에서만 들여쓰기로 보임
3.태그와 속성
속성="속성값"
태그만으로 부족한 기능을 보충. 속성들 순서는 상관 없음.
1)img

여는태그. img src(sorce)="이미지주소" width="nnn%" 닫는태그.
소문자 대문자 구분 중요! png PNG 구분 같은 것.
가로크기는 100%로 하면 사이트 크기에 따라 이미지 크기도 맞춰서 달라짐.
4.목차와 부모태그
1)부모태그 : ul(Unordered List)
2)부모태그 : ol(ordered list) 자동으로 숫자가 붙음.
3)자식태그 : li
부모태그는 반드시 자식태그가 붙어야 함.
5.문서의 구조
1)html임을 표시 : !DOCTYPE html
2)본문을 설명 : head
2-1)웹페이지 이름 : title
2-2)언어 한글 설정 : meta
여는태그. meta charset(캐릭터셋=글자세팅)="utf-8" 닫는태그.
3)본문 : body
4)디자인 용
블럭(가로 한 줄 차지) 레벨 엘리먼트 : div.
인라인(자기 크기만큼 차지) 엘리먼트 : span
6.주소창 연결
1)하이퍼링크 : a (anchor=닻)
여는태그. a href="주소" 닫는태그.
2)새 탭으로 링크 : target 속성
target="_blank"
3)클릭 전 미리보기 : title 속성
title="미리보기 내용"