목록분류 전체보기 (85)
YTCW

많이 쓰이지는 않지만알아두면 좋은 여러 가지 tag들을 배워보자.첫 번째로 간혹 문단 내에 어떠한 약어나어려운 단어들은 사용자가 생소하기 때문에잘 모르는 경우가 있는데마우스를 해당 단어에 올렸을 때어떤 내용인지 설명해 줄 수 있는 tag가 있다.바로 abbreviation ( abbr ) tag이다.아래의 문단을 예로 들어보자. The WHO was founded in 1948. 이런 문단이 있을 때WHO 를 모르는 사람도 있을 것이다.그러면 abbr tag를 이용하여해당 단어를 감싸준다.그리고 반드시 title attr 을 사용하여title="설명 내용" 에 설명할 내용을작성해 주면 된다. The WHO was founded in 1948. 두 번째로 어떤 대상의 이름, 전화번호, 지리, ..
media file 은 무엇일까?HTML 문서 안에 text 가 아닌 어떤 다른 형태의 데이터를 집어넣을 때 media file tag 들을 사용한다.앞서 알아본 img tag도media file tag 라고 할 수 있다.img tag를 제외하고audio tag와 video tag를 배워보자.첫번째는 audio tag 를 알아보겠다.사용 방법이 img tag 와 매우 유사하다.attr 으로 src="파일 경로"를 작성해 주고저장하면 아무것도 나타나지 않는다.재생 버튼과 볼륨 조절 버튼을보이게 하고 싶다면controls를 작성하면 된다. //컨트롤러 만들기 //컨트롤러는 보여주고 음소거 상태//컨트롤러는 보여주지않고 자동재생하기//컨트롤러는 보여주지않고 반복 자동재생하기 위 코드처럼 사용한..

table tag의 기본 구조는 배웠으니attr에 대해 알아보기table tag에는 어떤 attr이 있을까?대표적으로 scope="col or row"와colspan="숫자" or rowspan="숫자"가 있다.아래의 표를 만들면서 알아보자 사진을 보면 아침 식사는 가로로 전체 병합이 되어있고 경영학 강의, 응용 수학, 물리학 강의는세로로 두 줄 또는 세 줄로 병합되어 있다.기본 구조를 이용하여 작성부터 해보자. 시간 월 화 수 목 금 토 일 ..

table tag는데이터를 표로 담고 싶을 때사용하는 tag이다.table의 기본 사용법은이전에 ul, ol, dl 처럼전체적으로 감싸주고 시작한다.table tag 안에 넣고자 하는 데이터를 넣는다. 위 사진을 예시로table tag 안에 들어갈 field tag는tr, th, td 가 있는데제일 먼저 tr 을 파악해야 한다. tr 은 table row 의 약자이며총 3줄이므로 아래와 같이 작성한다. 그리고 tr 1번째 줄에는 th 1과 th 2th 가 2개 들어있다.th 는 table header 의 약자로테이블의 제목이다.차례대로 Month, Savings을 작성하고 Month Savings 그 아래 tr 2, tr 3에는td ( table ..
마지막으로textarea tag button tag 를 배워보자.input tag를 사용하면여러 줄의 정보를 받을 수 없다.그래서 textarea를 사용한다.textarea attr으로rows, cols 가 있지만 필수는 아니다.rows는 몇 줄의 text를 받을 건지 정하는 것이고cols는 가로로 몇 자의text를 받을 것인지 정하는 것이다. Review of W3Schools: At w3schools.com you will learn how to make a website. They offer free tutorials in all web development technologies. 그리고 form tag에 작성된정보를 submit 하기 위해서는button 이 필요하다.button에도..

form field tag 중 하나인select tag에 배워보자 일상적인 웹 라이프에서 이러한 박스를 많이 보았을 것이다.이것이 바로 select tag인데사용하기 위해선 간단한 문법 사항을 지켜야 한다.select 상자에 들어갈 목록을 만들기 위해서는option tag를 사용하여여러 개의 목록을 작성해 주고option tag attr에 서버로 보낼 value 값을 지정해 줘야 한다.이전 글에서는type="radio 또는 checkbox"에name attr을 이용하여 하나로 묶어주었지만select와 option tag는부모 자식 관계로 묶여있기 때문에option tag에 사용해 줄 필요가 없다.서버에 name=value로 전달할 때는 opction tag를 다 감싸고 있는select tag에 ..
form tag 안에 채울다양한 Field tag를 알아보도록 하자 첫 번째로는 input tag사용자에게 정보나 데이터를 받을 때가장 기본적으로 사용되는 field tag 중 하나이다.input tag를 사용할 때는 반드시 사용해야 할 attr이 있다면 type="?" 이다.사용자한테 받고 싶은 정보나 데이터 중에숫자만 받고 싶을 때가 있을 수 있고어쩔 땐 글자를 받고 싶을 때도 있고여러 가지가 있다.input의 attr에 대해 좀 더 배워보자.placeholder="원하는 문구"를 사용하면사용자가 아무것도 입력하지 않았을 때원하는 문구를 보여줄 수 있다.이때 사용자가 해당 input에 text를 넣기 시작하면placeholder 값이 사라진다. //두번째의 경우 value 값 html을 ..
form tag는이전에 배웠던 tag들과 목적이 다르다.사용자들에게 정보, 데이터를 받아서전달해 주는 목적으로 사용한다,간단한 예를 들면 로그인할 때아이디, 비밀번호를 작성하고로그인을 누르면 서버에 전달해 주는 tag이다.이 글에서는 form tag에 대한 개념만 알아보자.form tag에는 여러 가지attr이 있지만 그중에서도반드시 두 가지의 attr이 존재해야 한다.첫 번째는action="api의 주소"위 상황과 같이아이디, 비밀번호를 작성하고로그인을 눌렀을 때 이동해야 하는server의 주소값을 작성하는데그 주소를 action="api의 주소"에 작성해야 한다,우리는 server 를 배우고 있는단계가 아니기 때문에 넘어가고반드시 있어야 하는 attr이라는 것을명심해두자.두 번째는met..

다른 사람의 말을 인용할 때 사용하는 tag 는 두 가지가 있다.첫 번째blockquote는문단 전체 또는 긴 글을인용할 때 사용한다.예를 들면 이 사진의 글은둠 헬더 카마라의 인용한 글이다.사용법은 아주 간단하다.blockquote는문단 전체를 감싸면 된다. 내가 가난한 사람들에게 먹을 것을 나눠주면 그들은 나를 성자라고 부른다. 그러나 내가 사람들이 가난한 이유를 물으면 그들은 나를 공산주의자라고 부른다. When I give food to the poor, they call me a saint. When I ask why the poor have no food, they call me a Communist. - 돔 헬더 카마라 인용한 글에 대한 출처가 text 일 때..
정의할 때 사용하는 정의 list description list ( dl ) 은앞글에서 배운 ul, ol과 마찬가지로전체를 감싸는 tag이다. 그다음에 사용하는 tag는li tag 가 아니라description term ( dt ) 를 사용한다. dt 는 정의할 대상을 작성하는 곳이다. 그다음 사용할 tag는description data ( dd ) 를 사용한다.dd tag 는 dt tag 를 설명하는 내용이 들어와야 한다. dd tag 는 문단, 줄 바꿈, 이미지, 링크, 목록을 넣을 수 있다. 이제 tag에 대한 이론은 들었으니적용한 예를 살펴보자 Coffee Black hot drink //dd가 윗방향으로 dt를 만났을때 dt에 대한 정의 내용이 맞다면..