HTML 1일차 - h1, 단락, 강조, a, img, list

태그의 구조

     - <p>(열린 태그) 내용 </p>(닫힌 태그)

     - attribute - 태그에 추가적인 정보 제공

     - 웹 표준에 맞는 올바른 사용법을 익혀야



제목 / 단락

     - 제목 : h1, h2, h3 .....h6
          - 핵심 태그는 제목 태그를 사용한다!

     - 단락 : p(paragraph)
          


강조(emphasis) 태그(html에게 중요하다는 것을 알림)

       - em, strong 태그
           - em : 글씨 기울어짐, 
             strong : 글씨 두꺼워짐


 anchor tag

     - href : hypertext reference (reference : 주소값)

     - href 주소값 표기 방법
          1. homepage url 입력

          2. 페이지 내 이동
                예) id 값이 hello인 곳으로 이동
                        - a href="#hello"

          3. 메일 쓰기
                 예) 나에게 메일을 쓰려고 하는 상황
                         - a href="mailto:han1693516@gmail.com">

           4. 전화 걸기(모바일)
                 예) 나에게 전화
                       - a href="tel:010-1111-2222"

           
        - target="_blank"
               - 원래 페이지에서 새 페이지 열려고 할 때
          

img tag
  
         - src(source)
              - 이미지 파일의 상대 경로, 구글 이미지 오른쪽 - copy image address 복붙

          - alt(alternative text)
               - 네트워크가 느려서 봐야 할 이미지가 뜨지 않을 때 나오는 텍스트 속성
               - 시각장애인이 스크린리더 사용 시에도 사진에 관한 설명이 alt 속성 텍스트로 나옴

list tag
          
          -li (list item)
            cf> ul, ol의 자식요소는 li만 가능
                    즉, a나 p 등은 불가능 (li 안에서는 가능)

           - ol
                - 순서가 적용되는 list
                - 예) 실시간 검색어 등

           - li
                - 순서가 적용되지 않는 list

alt 키 누르면 커서 다중 선택 가능 in vscode

 

 

 

저 혼자 보는 용이여서 다른 사람이 보기에는 불편할 수 있습니다.