HTML 기초

보라도리·2021년 8월 3일
0
post-thumbnail

📌 텍스트 표시

📏 HTML 문서에서 텍스트는 특별한 태그 없이도 <body> 태그 안에서 표시할 수 있다.
📏 여러 줄로 이루어진 텍스트는 단락을 생성한 후에 단락 안에서 표시하는 것이 좋다.
📏 HTML문서를 작성할 때 단락을 생성하지 않으면 입력한 줄 바꿈 문자는 완전히 무시된다.
📏 연속된 스페이스는 하나의 스페이스로 간주된다.

📚 단락

📏 단락(paragraph)<p> 태그로 정의된다.
📏 웹 브라우저는 자동적으로 단락의 전후에 빈 줄을 추가한다.

📚 br 태그

📏 <br> 태그는 "break"에서 나온 용어이다.
📏 새로운 단락을 시작하지 않고 줄바꿈을 원한다면 <br> 태그를 사용하면 된다.
📏 종료 태그를 가지지 않는 태그이다.

📚 pre 태그

📏 <pre> 태그는 "previously formatted text"에서 나온 용어이다.
📏 입력한 그대로 화면에 표시하기 위해 사용한다.
📏 개발자가 입력한 스페이스나 탭, 줄 바꿈이 그대로 유지된다.

📚 헤딩

📏 헤딩(heading)은 웹 페이지의 머리기사(headline)이다.
📏 신문의 머리기사도 여러가지 크기가 있듯이, 헤딩도 <h1>부터 <h6>까지 6개의 태그를 이용해 정의된다.
📏 <h1> 가장 크기가 크다.

📚 주석

📏 주석(comment)은 코드를 설명하는 글이다.
📏 새로운 개발자가 코드를 이해하는 데 상당한 도움을 준다.
📏 현재 불필요한 코드를 일시적으로 제거할 수 있는 중요한 수단이 된다.

<!-- 이것이 주석입니다. --> 

📚 텍스트 서식

📏 "한글"과 같은 워드 프로세서에는 글자를 두껍게 하거나 글자를 이탤릭체로 만드는 메뉴가 있다.
📏 HTML에서도 동일한 기능을 하는 태그가 있다.

	📜 <b>...</b>  : 볼드체로 만든다.
	📜 <i>...</i>  : 이탤릭체로 만든다.
    	📜 <strong>...</strong> : 택스트를 강하게
    	📜 <em>...</em> : 텍스트 강조
        📜 <code>...</code> : 텍스트가 코드임을 표시
        📜 <sup>...</sup> : 위첨자
        📜 <sub>...</sub> : 아래첨자

📚 수평선

📏 <hr> 태그는 "horizontal line"의 약자이다.
📏 <hr> 태그를 사용하면 브라우저의 너비만큼 수평선을 그릴 수 있다.

📚 특수 문자

📏 '<''>' 같은 문자를 화면에 표시하기위해 사용하는 특수 문자

	📜 &nbsp; : non-breaking space의 약자로 공백 문자 한 개
    	📜 &lt; : <
        📜 &gt; : >
        📜 &quot; : "
	📜 &amp; ; &    

📚 리스트

📏 리스트는 항목을 나열하는데 사용된다.
📏 번호 없는 리스트(unordered lists)<ul>태그로 시작하고,  
   리스트 항목은 <li> 태그를 사용하고 "list item"의 약자이다.
📏 번호 있는 리스트(ordered lists)<ol>태그로 시작하고,
    리스트 항목은 <li> 태그로 사용하고 "list item"의 약자이다.

📚 링크

📏 하이퍼 링크(또는 링크)는 다른 문서로 점프할 수 있는 단어나 이미지를 뜻한다.
📏 <a>태그가 하이퍼링크를 정의하고, "anchor"의 약자이다.

📄 target 속성
: 링크가 클릭되었을 때, 새로운 페이지가 어느 곳에 열릴지를 지정하는 것
📏 _blank : 새로운 윈도우에서 새로운 페이지를 연다.
📏 _selef : 현재 윈도우에 새로운 페이지를 적재한다.
📏 _parent : 부모 프레임에 새로운 페이지를 적제한다.
📏 _top : 현재 윈도우에 새로운 페이지를 적재하고 모든 프레임을 취소한다.
📍 _self가 디폴트 값이다.

📚 이미지

📏 이미지는 <img>태그로 정의된다.
📏 width와 height속성은 이미지의 가로와 세로를 지정하는데 사용된다.

📄 alt 속성
: 브라우저가 어떠한 이유로 이미지를 화면에 표시하지 못했을 경우에,
표시되는 대체 텍스트(alternate text)를 지정한다.

📚 테이블

📏 테이블은 표 형태의 데이터를 표시하는데 사용된다.
📏 <table>태그로 사용된다.
📏 테이블의 하나의 행을 <tr>...</tr>로 표현하고, "table row"의 약자이다.
📏 행 안의 하나의 데이터는 <td>...</td>로 표현하고, "table data"의 약자이다.

📄 테이블에서 열과 행의 병합
: 테이블에서 각 셀은 필요에 의해서 얼마든지 병합될 수 있다.
📏 행이 병합되는 것을 행병합(row sqan)이라고 한다.
📏 열이 병합되는 것을 열병합(column sqan)이라고 한다.

📄 테이블의 캡션
 : 테이블의 제목을 삽입히려면 <caption>...</caption>을 사용하면 된다.
profile
오예~~

0개의 댓글