HTML <TAG>, 단축키

강정우·2022년 6월 21일
2

HTML, CSS

목록 보기
5/27
post-thumbnail

#1 HTML 코드 정리

  1. 단축키
    1) ! +Enter
    기본 <!DOCTYPE> 뼈대가 만들어짐.
    2) EX) p +ENTER
    각 태그들은 알파벳 부터 치고 ENTER을 치면 자동으로 태그완성.
    3) EX) a>img +ENTER
    어떠한 태그안에 태그를 또 넣고 싶을 땐 "a>img" 이런식으로 부등호로 표현 후 엔터를 치면 자동으로 뼈대가 완성됨.
    더 바깥에 있을 태그쪽으로 부등호 방향을 설정, 단일 태그보단 당연 일반 태그가 더 큼.
    4) EX) br*50 +ENTER
    한방에 여려개의 같은 태그를 완성하고 싶을 때 사용.

  2. 구성요소
    1) head
    (1) meta : 간단한 설명 기재
    (2) title : 위에 창에 보일 이름 기재

    2) body
    (1) p : 단락을 표시할 때 사용
    (2) h1~6 : 헤드 부분에 큰 글씨를 쓸 때 사용 (숫자가 커질수록 글자는 작아짐.)
    (3) br : break return으로 다음 줄로 넘길 때 사용 (단락을 맺을 때 쓰는 P와 함께 쓰면 공백이 더 길어짐.)
    (4) i, em : 글자를 기울일 때 사용.
    (5) b, strong : 글자를 강조할 때 사용.(4,5 기능은 같지만 다른 점은 스크린 리더에서 다름. 시각장애인들을 위해 차별을 둠.)
    (6) sup, sub: 논문에 들어가는 위첨자, 아래첨자
    (7) img 이 부분은 따로 다루겠음.

  3. 속성
    1) align="center | right | left" 글의 정렬을 의미
    2) href="주소 | #tag_id" 하이퍼링크를 의미 주소을 넣을 땐 프로토콜 요소인 https:// 를 반드시 넣어줘야함. tag_id를 넣을 땐 해당위치로 스크롤이 바뀜.
    3) 이때 p#id로 치면 자동으로 해당 href에 대한 id값이 완성됨

profile
智(지)! 德(덕)! 體(체)!

0개의 댓글