이미지를 삽입하는 <img> 태그
src 속성은 이미지 파일의 경로를 지정하여 웹 브라우저에 알려주는 역할을 하며 반드시 있어야 하는 요소. alt 속성에는 인터넷이 불안정하거나 이미지 파일 경로를 잘못 넣었을 때처럼 이미지를 제대로 표시할 수 없는 경우에 이미지 대신 나타날 대체용 텍스트를 입력한다.
<img src = "이미지 파일 경로" alt = "대체용 텍스트">이미지 크기를 조절하는 width,height 속성
<img> 태그로 이미지 파일을 삽입하면 원래 이미지 크기대로 표시된다. 이때 이미지 파일은 수정하지 않고 웹 브라우저 창에서 보이는 이미지 크기만 조절하고 싶다면 width와 height 속성을 사용할 수 있다. width는 이미지의 너비를, height는 이미지의 높이를 지정하며, 2개 속성중 1개만 사용할 수도 있다. 사용할 수 있는 단위는 퍼센트(%)와 픽셀(px)이 있다.
오디오와 비디오 삽입
다양한 멀티미디어 파일을 삽입하는 <object>,<embed> 태그
<object> 태그는 오디오 파일뿐만 아니라 비디오, pdf등 다양한 멀티미디어 파일을 삽입할 때 사용한다. <embed> 태그는 HTML 초기 버전부터 사용해왔던 태그로 대부분 브라우저에서 사용할 수 있다. <embed> 태그에서는 src 속성을 사용해 삽입할 멀티미디어 파일을 지정한다. <embed> 태그에는 닫는 태그가 없다.
HTML의 <audio>,<video>,<object> 태그를 지원하지 않는 웹브라우저를 고려해야 하는 경우에 <embed> 태그를 사용해서 멀티미디어 파일을 삽입할 수 있다.
오디오와 비디오 파일을 삽입하는 <audio>,<video> 태그
HTML에서 배경 음악이나 효과음 등 오디오 파일을 삽입할 때는 <audio> 태그를 사용하고, 비디오 파일을 삽입할 때는 <video> 태그를 사용한다. 이때 오디오나 비디오 파일을 시작하거나 종료할 수 있는 컨트롤 바 속성을 함께 표시하려면 controls 속성을 함께 사용한다.
하이퍼링크 삽입하기
링크를 삽입할때 <a> 태그와 href 속성
링크는 <a> 태그로 만드는데, 이때 텍스트를 사용하면 텍스트 링크가 되고 이미지를 사용하면 이미지 링크가 된다.
<a href = "링크할 주소"> 텍스트 또는 이미지 </a>폼 삽입하기
폼을 만드는 <form> 태그
폼을 만드는 가장 기본적인 태그로 <form>과 </form> 사이에 여러가지 폼 요소를 넣는다.
<form [속성 = "속성값"]> 여러 폼 요소 </form>폼 요소를 그룹으로 묶는 <fieldset>,<legend> 태그
하나의 폼 안에서 여러 구역을 나누어 표시할 때 <fieldset> 태그를 사용한다. <legend> 태그는 <fieldset> 태그로 묶은 그룹에 제목을 붙일 수 있다.
<fieldset>
<legend> 그룹 이름 </legend>
</fieldset>폼 요소에 레이블을 붙이는 <label> 태그
<label> 태그는 <input> 태그와 같은 폼 요소에 레이블을 붙일 때 사용한다. 레이블이란 입력란 가까이에 붙여 놓은 텍스트를 말한다. <label> 태그를 사용하면 폼 요소와 레이블 텍스트가 서로 연결되었다는 것을 웹 브라우저가 알 수 있다.
웹 폼의 다양한 곳에서 사용하는 <input> 태그
<input> 태그는 다양한 폼에서 사용자가 입력한 정보를 받을 때 사용한다.
<input>태그의 다양한 type 속성text, password, search, url, email, tel, checkbox, radio, number, range, date, month, week, time, datetime, datetime-local, submit, reset, image, button, file, hidden
여러 줄을 입력하는 텍스트 영역 <textarea> 태그
<textarea> 태그에서는 너비 크기를 지정하는 cols 속성과 화면에 텍스트를 몇 줄 표시할지 지정하는 rows 속성을 사용한다.
드롭다운 목록을 만들어 주는 <select>, <option> 태그
<select> 태그로 드롭다운 목록의 시작과 끝을 포시하고, <option> 태그를 사용해 원하는 항목을 추가한다.
TIL 11 day
HTML 다 뿌숴버렸다💥
이제 CSS 뿌수러가자🔨
