1️⃣ HTML

---

1. form 태그

• 웹페이지 내에서의 입력 양식을 만들어준다.

• <input></input> : 입력요소를 만드는 태그

  <속성>

  1. type=“text/password/checkbox/radio/submit/reset/button/file/”
     • html5 추가) type=“ email / search / url / number / tel / date / datetime / week / time / range / color …”
     • date 부터는 지원 안되는 브라우저 많아서 잘 쓰이지 X
  2. maxlength=“” 최대입력가능글자
  3. placeholder=“” 입력팁 (ex. 최대 10자까지 입력 가능 )
  4. value=“” 입력값(기본값) ⭐️

  • input type="submit" value="제출하기" 폼 데이터 제출
    
  • <input type="reset" value="취소하기"> 폼 데이터 초기화
    
  • <input type="button" value="확인"> 클릭이벤트와 연결, 자바스크립트를 활용해서 사용
    

• <button></button> : <input type="button">과 같은 역할.
  여닫는 태그 있기 때문에 안에 텍스트, 이미지 등을 넣을 수 있음
  

2. iframe 태그

• 문서 안에 다른 문서 삽입 할 때 사용

  <속성>

  • src=“불러올 문서의 경로”
  • width=“”
  • height=“”
  • frameborder=“” -> 위의 3개는 스타일 요소로, 잘 쓰이지 않고 css으로 분리 권장(표준 문법)
  • title=“”

---

2️⃣ CSS

---

1. 폰트 지정

• @font-face{font-family:"글꼴명";src:url(경로) format("");}```

<format 종류>

• ttf 트루타입
• otf 오픈타입
• woff 웹오픈폰트
• woff2 웹오픈폰트2
• svg (요즘 많이 쓰임)

2. Vender prefix

• 새로운 css 속성이나 값이 완벽하게 제정된 상태가 아닐 때, 밴터프리픽스를 설정해서 작성하면 해당 기능이 포함되지 않은 브라우저들도 그 기능을 사용할 수 있다.

<브라우저별 종류>

• -webkit- : 구글, 사파리 브라우저
• -moz- : 파이어폭스 브라우저
• -o- : 오페라 브라우저
• -ms : 익스플로러(거의 안씀)