이진욱의코딩

오늘 포스팅 내용은 여러 가지 태그에 대해 알아보는 시간을 가지도록 하겠습니다. -목차- 1.오디오태그 오디오 태그는 웹브라우저에서 플러그인의 도움 없이 음악을 재생할 수 있게 만들어주는 HTML5 태그이다. HTML5에서 추가된 기능이므로 IE8 이하에서는 사용할 수 없다. 옛날 html은 각자 확장자에 따라서 mp3, ogg, wmv 등이 있었지만 현재는 mp3만 적어도 됩니다. 이런 식으로 말이죠. controls는 말 그대로 음악 재생할 때 직접 컨트롤을 할 수 있게 만드는 명령어입니다. 2. 비디오 태그 비디오 태그는 웹페이지에서 동영상을 볼 수 있게 만들어주는 기능을 수행한다. 원래 HTML5 시대가 오기 전에는 비디오도 윈도 미디어 플레이어 또는 플래시와 같은 플러그인을 사용해서만 볼 수 있..

이번 시간에는 저번 시간에 했던 폼 태그를 응용하는 모습을 보여드리겠습니다. 우선 우리가 이번시간에 만들 것을 미리 보도록 하겠습니다. 어제 했던 거랑 비슷하죠? 그러니 바뀐부분이나 추가된 부분만 설명하겠습니다. 신청자 이름 autofocus는 자동으로 포커스를 맞춰주는 역할을 합니다. required는 반드시 작성해야 하는 칸으로 바뀌게 하는 역할을 합니다. placeholder은 미리 회색으로 텍스트가 뜨게만드는 역할을 합니다. 물론 마우스를 갖다 대면 사라지죠. -- 이런 구조로 보통 연락처를 기입할때 사용하는 방식입니다. datalist는 input type text한테 리스트를 부여해주는 태그입니다. 이런 식으로 말이죠. input type 중 reset은 기입한 내용을 모두 초기화시키는 역할을..

폼은 웹 페이지의 정보를 다른 페이지로 전송하는 역할을 합니다. 단순히 텍스트의 내용만 보여주는 페이지에는 필요 없지만 서로 데이터를 주고받으며 움직이는 웹 페이지일 경우 반드시 드어가는 요소입니다. 예를 들어 로그인할 때 아이디와 비밀번호는 form태그가 자신의 내부에 있는 input박스 정보를 넘기는 것입니다. 이런 폼에 대해서 예제와 함께 하나씩 알아봅시다. l action : 폼 내부에 데이터를 보내는 목적지 URL을 지정한다. l actocomplete : HTML5 HTML5에 추가되었으며 양식의 자동완성을 지정한다. l enctype : 넘기는 Content 타입을 지정하는데 주로 파일을 넘길 때 많이 사용한다. type 은 “multipart/form-data” 로 지정해서 사용한다. l ..

이번 시간은 table태그에 대해 알아보도록 하겠습니다. 말 그대로 table이기 때문에 칸을 만들어서 이것저것 한번 해보도록 할 예정입니다. 표 태그라고 하기도 하며 웹 개발과정에서 필수이기도 합니다. 먼저, 기본적인 html 코드를 먼저 작성을 한 뒤에 body부분 안에 코드를 적을 겁니다. 테이블을 만드는 순서는 다음과 같습니다. 먼저 제일 바깥쪽에는 태그가 들어갑니다. 그리고 가장 위에는 라는 테이블 헤더 태그를 사용합니다. Default값은 굵은 글씨체에 가운데 정렬이 기본값입니다. 실질적으로 이 태그는 안 쓰는 사람이 훨씬 많습니다. (대부분 태그를 활용하여 테이블 헤더를 만듭니다. ) 그다음은 행을 만드는 태그 태그가 들어갑니다. 그리고 태그 안에는 열을 만드는 속성 태그가 들어갑니다. 아래..

저번 포스팅 마지막 부분에서 했던 하이퍼링크 사용법에서 좀 더 추가해서 적어보도록 하겠습니다. 보통 네이버 홈페이지 메인화면을 보면 검색창 옆에 초록색의 NAVER라고 있습니다. 이 버튼을 클릭하면 달라지는 것 없이 홈 화면이 새로고침이 됩니다. 이것은 링크연결 a라는 태그에서 #을 적으면 다른 화면으로 넘어가지 않고 새로고침이 됩니다. 9월 9일 포스팅 내용을 보면 줄 바꿈 태그를 따로 쓰지 않아도 알아서 줄 바꿈이 되는 것을 볼 수 있는데요 이런 것을 block요소라고 합니다. p태그, li태그도 block요소 중 하나 이와 반대로 줄 바꿈이 되지 않고 한 줄에 전부 나타나는 것이 inline요소입니다. html 코드를 전체적으로 본다면 block이 작용되는 부분이 inline요소보다 큽니다. 기존의..

이번 시간에는 여러 가지 태그를 알아보도록 하겠습니다. 목록을 한 번 봅시다. 1. 순서를 가지는 태그 2. 순서가 없는 리스트 3. 정의어 목록 리스트 4. 하이퍼링크(앵커 태그) 1. 순서를 가지는 태그(ordered list) 웹에서 F12를 누른 뒤 여러 가지 목록들을 보면 부모 태그 밑에 자식 태그들이 존재한다는 것을 볼 수 있습니다. ordered list 줄여서 이라는 태그를 쓰면 자동적으로 내가 적은 목록들 앞에 숫자가 붙는 것을 볼 수 있습니다. 그 안에 태그를 적어서 또 큰 카테고리로 나눌 수 있습니다. 말 그대로 순서를 가지는 태그이기 때문에 따로 앞에 숫자로 순서를 표기하지 않아도 자동적으로 표기가 됩니다. 예시를 보도록 하겠습니다. 제일 좋아하는 요리순 한식 고기 찌개 떡볶이 중식..

오늘부터 저는 it학원을 다니기로 했습니다. 그 이유는 react.js나 vue.js를 빨리 접해보고 싶기도 하면서 제가 부족한 부분을 채울 겸 기초를 단단히 하고 싶은 마음에 생전 처음으로 학원 등록을 했습니다. 9월 9일부터 시작해서 2월까지 총 5개월 과정으로 신청을 했습니다. 그래서 저는 오늘부터 학원에서 배운 것들을 복습 차 블로그에 하나하나 기록을 할 예정입니다. 5개월 동안 말이죠. 물론 학원 공부뿐만 아니라 제가 따로 책을 사서 공부할 예정입니다. 물론 블로그 포스팅도 하고요. 서론은 여기까지 적고 오늘 배운 내용에 대해 포스팅을 해보도록 하겠습니다. 수업은 vs, atom, edit+등의 프로그램 도구 중 본인이랑 잘 맞는 프로그램을 선택해서 사용하시면 됩니다. 저는 기존에 ms에 있는 ..