생활코딩 html 공부하기7

생활코딩 html강의를 다 들었다.

2020.02.28

오늘은 생활코딩 html강의를 다 들었다.

html관련 강의는 또 있지만 내가 듣는 부분의 강의를 다 들어서 뿌듯했다.

 

iframe이라고 다른 사이트를 나의 사이트에 가지고 오는 태그를 공부했다.

보안에 취약하게 될 수 있어서 잘 모른다면 안쓰는게 좋다고한다.

 

그리고 html5의 새롭게 지원되는 기능들과 입력값을 체크하는 속성들을 공부했다.

들으면 나중에 도움이 될 것 같다.

요즘 많이 쓰는 태그를 찾아주는 사이트를 알려주었다. 나중에 도움이 많이 될 듯하다.

 

원래 일주일 잡고 공부한 강의 였는데 블로그 체험단, 친구 약속 등의 핑계로 3주정도 걸렸다.

코로나가 사람을 집에 있게 만들고 심심하니깐 공부하게 시키는 것 같다.

개강도 미뤄져서 공부를 더 하고 복학할 수 있어서 다행이라고 생각한다.

 

오늘의 메모장

2020.02.28
iframe
어떤 사이트안에 다른 사이트를 가져오는 것을 의미한다.
공유할때 소스코드를 복사하면 그것이 iframe인 것을 알 수 있다.
조심해야할 것은 출처가 의심되는 사이트를 iframe에 넣으면 방문자들에게 피해를 입히기 때문에 보안적으로 취약하다.
잘 모른다면 안 쓰는게 좋다.
깊게 들어가면 끝도 없다.


HTML5
video태그
웹사이트에서 비디오를 출력할 수 있게한다.
브라우저마다 지원하는 동영상의 저장방법이 다르다.
controls를 넣으면 영상을 조절할 수 있다.

caniuse.com
현재에도 쓰는 태그를 알려주는 사이트이다.
프로그램을 만들때 유용하다.

새로운 제출 양식들
form
input의 타입 number 숫자만 입력하게 하는 기능이다.
사용자의 입력을 규제하는 역할이다.
min max 으로 범위도 규제할 수 있다.
모바일에서 설정할 때도 적용된다.
모바일에서는 키보드를 킬때 숫자키보드를 보이게한다.
submit 버튼을 만들면 사용자가 범위를 넘어가는 정보값을 입력할때 제출을 거부한다.
color 색
date 날짜 캘린더가 나온다.
datetime 국제 표준시
datertime-local 살고있는 지역 시간
email 이메일을 전송하게 한다. 아니면 에러메세지가 표시된다.
모바일에서도 기능 지원한다.
month 달 월까지 입력 가능하다.
range 범위를 슬라이더로 지정할 수 있다. min max를 지정한다.
search 아무런 기능이없다. 일반적인 텍스트 필드와 구별할 수 있다. 정보의 가치를 높인다.
tel 전화 모바일에선 전화번호를 입력하기 쉬운 키패드가 나온다.
time 시간 몇년 시간을 입력가능하다.
url url정보를 입력할 수 있다. 모바일 환경에서는 키패드가 입력하기 쉽게 나온다.
week 주 몇년도 몇번째 주 지정가능하다.

html5 입력폼의 새로운 속성들
웹브라우저의 자동완성 기능이 있다.
autocomplete 속성을 on 하면 된다.
부분적으로도 가능하다.
placeholder 속성을 입력하면 입력창 안에 글을 쓸 수 있다.
autofocus
웹페이지가 열렸을때 자동으로 검색창에 입력이 가능한 속성이다.

html5 입력 값 체크
required 속성 입력창에 입력하지 않으면 제출이 불가능하다.
반드시 입력해야되는 값을 지정할 수 있다.

patern [a-zA-Z] 형식을 지정할 수 있다.
조금 어려운 개념이라 대충 이해하고 넘어가면 된다.
정규표현식에서 . 은 어떤 문자든 상관 없는 것을 말한다.
+는 어떠한 문자가 하나이상와야한다는 것을 의미한다.
[0-9]는 숫자로 와야한다는 것을 의미한다.

html강의 다 들었다. 

 

오늘의 코딩공부 캡쳐화면

내일부터는 css강의를 들어야겠다.