- 제일 안쪽태그가 닫히기전까지 다른태그를 닫을 수 없다
<img src = “” /> 셀프 클로징 태그도 있다- div, span, img, a , ul, li, input 등 자주쓴다, 안외워도됨
- div태그는 한줄공간을차지하고
- span태그는 컨텐츠 공간만큼을 차지함
- img태그는 src라는 속성 (키,값)을 가지고 닫는태그없음
- a 하이퍼링크
<a href=“naver.com”>네이버</a>
- ul, li (반복)리스트
- input, textarea 다양한 입력폼 체크박스, 라디오버튼 등
- div사이에 input태그를 넣으면 한줄에 한박스가 나옴
- 라디오버튼은 여러개중하나체크(name속성으로 묶어줘야 됨), 체크박스는 여러개 가능
<button>로그인</button>- 시멘틱요소 브라우저에게 잘보이려면
<hi>같은 의미를 가진 요소를 잘써야함** article, aside, footer, header, nav, main 등이 있음 외우진마
- 와이어프레임: 도형으로 인터페이스를 시각적묘사한것
- 원하는 영역은 여러태그를 하나의 div로 감싸줘야함
<form>은 사용자 입력값을 다른페이지로 전송- html의 속성 id, class를 통해서 이름을 붙여줄수있다
- selector로 간편하게 표현할 수 있다. id는 div#writesection 이렇게 전체문서의 고유한부분에만 적용, class는 div.username 처럼 반복되는 값에 적용
- 하나의 태그에 클래스를 여러개 작성해주고 싶을 땐 하나의 문자열 안에서 띄어쓰기로 구분해주면 됩니다.
- 큰구역을 나타낼때는
<section>이 <div>보다 낫다
<input id="id-input" class="input focus" type="text" placeholder="ID" />
<input
id="password-input"
class="input focus"
type="password"
placeholder="password"
/>
<button id="login-button">Login</button>
<label> <input id="keep-checkbox" type="checkbox" />Keep Login </label>
<link rel="stylesheet" href="style.css" />
