html 배우기6 HTML 쉽게 배우기 | 양식 <form> 2 안녕하세요 오늘은 에서 사용되는 , , 그리고 에 대해서 알아볼게요 이력서 같은 양식을 보면 인적사항, 학력사항, 자격증, 등등 나눠져있는걸 볼수있죠 이렇게 각 섹션을 만들때 을 사용합니다. 의 정의는 양식에 비슷한 내용들을 그룹화 하는데 사용되는 요소입니다. 이 요소를 사용하면 요소 안에있는 내용 주위에 박스를 그립니다. 이 박스를 그림으로서 양식의 내용들이 어떤식으로 그룹됐는지 알아보기 쉬워집니다. 양식을보면 각 섹션에 제목이 있는걸 볼수있습니다 으로 양식의 내용들을 나누었으면, 로 나누어진 각 그룹에 제목을 붙일수 있습니다 이 요소는 의 제목을 정하는 요소이기 때문에 밖에서 사용하면 그 의미를 잃어버립니다. 그렇게 때문에 안에서 사용합니다. 종이 양식에서는 볼수 없지만, 온라인 양식에서는 한번쯤은 .. 2020. 12. 12. HTML 쉽게 배우기 | 입력창 <input> 안녕하세요 오늘은 에 대해서 알아볼게요 은 셀프 클로징 요소로 닫힘 태그가 없습니다 은 긴 네모 박스 모양으로, 사용자가 정보를 입력할 수 있는 요소입니다 은 여러 가지의 용도로 사용할 수 있습니다 예상외로 우리는 을 정말 많이, 그리고 자주 사용합니다 로그인할 때, 댓글 쓸 때, 날짜를 고를 때, 등등 "내가 본 로그인은 박스 모양이 아니던데?" 은 다른 요소들에 비해서 개발자들이 스타일을 제일 많이 바꾸는 요소중 하나입니다 의 기본 스타일은 네모난 박스 모양인데, 이 스타일을 바꿔서 우리가 자주 보는 예쁜 모양으로 변합니다 그럼 의 기본 코드를 볼게요 을 사용할 때 필수 속성은 type 하나입니다 이 type에 따라서 추가되는 속성이 달라집니다 의 type은 여러 개가 있는데, 그중 몇 개만 알아볼게.. 2020. 11. 22. HTML 쉽게 배우기 | 비디오 <video>/<iframe> 안녕하세요, 오늘은 HTML을 사용해서 비디오를 넣는걸 알아볼께요. 웹페이지에 비디오를 넣는 방법은 두 가지가 있는데요, 하나는 태그와 내 비디오 파일을 사용하는 방법, 다른 하나는 태그와 유튜브를 사용하는 방법입니다. 태그를 사용해서 비디오 넣기 저번에 이미지를 넣을때 태그를 사용했었죠. 이와같이 비디오를 넣을때 태그를 사용해서 비디오를 넣을수 있습니다. 태그와 같이 태그에 src 를 제공해야 합니다. 저는 짧은 비디오를 하나 다운 받아서 html 문서와 같은 위치에 저장했습니다. 그리고 태그를 아래와 같이 작성합니다. 호환되지 않는 브라우저 입니다. 하나 하나 살펴볼까요? 태그와는 다르게 는 열림/닫힘 태그로 이루어져 있습니다. width="400", 이거 모르시는분 없죠? 맞아요, 비디오의 넓이를 .. 2020. 10. 19. HTML 쉽게 배우기 | 링크 <a> 안녕하세요. 오늘은 링크에 대해서 알아볼게요. 링크란 단어가 생소하신 분들을 위해서 간단하게 설명하자면, 웹사이트에서 클릭했을 때 다른 페이지로 간다거나, 파일이 다운로드됀다거나 할 때 있죠? 이런 걸 링크라고 부릅니다. 링크 태그는 와 로 만들 수 있습니다. 열림 태그와 닫힘 태그 사이에 링크에 대한 글을 작성하면 됩니다. (p 태그 사용 안 합니다) 이 링크 태그에는 하나의 필수 속성이 있고, 몇 가지의 추가할 수 있는 속성들이 있습니다. 필수 속성과 두 가지의 추가 속성을 살펴볼게요. (네, 이 3개 이외의 다른 건 사용해본 적이 없습니다 😓) 필수 속성: href href 는 링크의 목적지 주소를 제공하는 속성입니다. 예를 들어서 Google 이렇게 링크를 만들면 클릭했을 때 구글로 이동합니다. .. 2020. 10. 12. HTML 쉽게 배우기 | 목록 (ul, li, ol, dl, dt, dd) 안녕하세요. 오랜만이네요. 오늘은 HTML에서 목록을 만드는 방법을 알아볼 거예요. 목록하면 앞에 점으로 돼있는 목록, 그리고 숫자로 돼있는 목록이 있죠. 당연히 HTML에서도 이런 목록들을 아주 쉽게 만들 수 있습니다. 먼저 점으로 돼있는 목록을 볼게요. 점으로 되있는 목록을 만들 때 사용하는 태그들은 과 입니다. 은 Unordered List(언오더드 리스트)의 약자이고, 는 List Item(리스트 아이템)의 약자라고 생각하면 외우기 쉽죠. 언오더드 리스트, 말 그대로 정렬되지 않은 리스트죠. 리스트 된 내용이 어떤 순차적인 의미가 없는 경우에 사용합니다. 예를 들어 캠핑 갈 때 적는 준비물 리스트 같은 거죠. 그럼 HTML 코드를 볼게요. 안에 가 들어갑니다. 그럼 없이 만 사용하면 안 돼? 사용.. 2020. 10. 4. HTML 쉽게 배우기| HTML 소개 웹 개발에 관심 있으신 분? 블로그를 더 잘 사용하고 싶어서 HTML을 배우고 싶으신 분? 목적이 뭐든 누구나 쉽게 배울 수 있는 HTML 블로그입니다. 개인적으로 서론이 긴 거 별로 안 좋아하는데, 그래도 HTML이 뭔지는 설명해야 될꺼같아서 간단하게 해 볼게요. HTML은 HyperText Markup Language (하이퍼텍스트 마크업 언어)의 약자입니다. 이게 무슨 말이냐면, 우리가 인터넷 할 때 사용하는 브라우저에 내용을 표시할 수 있는 문서를 작성할 때 사용하는 컴퓨터 언어입니다. 웹 사이트든 블로그든 브라우저에서 볼 수 있으려면 HTML 문서가 필요합니다. 이 문서는 태그와 요소들로 이루어져 있으며 이 요소들을 브라우저가 번역해서 우리가 보기 쉽게 표시해 줍니다. 좀 더 간단하게 설명하자면.. 2020. 9. 13. 이전 1 다음 반응형