'HTML 독학' 태그의 글 목록

HTML 독학 (4)

HTML 독학을 위한 HTML순서 목록만들기 <ol> + <li> / <ul> +<li>

programming/HTML Take-it 2020. 6. 21. 19:41

이번에는 HTML에서 순서 목록을 구분해주는 태그에 대해서 한번 공부해보도록 하겠습니다. 순서가 있는 목록! 태그 태그의 속성 type : 항목 앞에 붙는 번호의 형식을 지정할 수 있다. type="A" (대문자) type="a" (소문자) type="I" (로마 숫자 대문자) type="i" (로마 숫자 소문자) type을 지정하지 않을 경우 기본 숫자로 표시됨. start : 항목 앞 번호의 시작을 지정할 수 있다. start ="2" 2번째 부터 시작 예) type="A" start="2" 속성설정시 B 부터 시작 당근 수박 사과 순서가 있는 목록 태그를 아무것도 설정하지 않고 태그의 리스트를 보여주는 태그를 활용하여 당근, 수박, 사과 소스를 한번 확인해 보겠습니다. 당근 수박 사과 태그만을 사용..

HTML 독학을 위한 HTML의 문단 <p>, <br>, <pre>,<blockquote>

programming/HTML Take-it 2020. 6. 21. 16:54

이번에는 , , , 태그에 대해서 한번 알아보겠습니다. 단락 구분 태그, 개행 태그 태그는 일반적으로 단락을 구분하기 위해서 사용하는 태그입니다. 웹 상에서 가장 많이 볼 수 있는 태그 중 하나이기 도 합니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세 무궁화 삼천리 화려강산 대한사람 대한으로 길이 보전하세! 무궁화 삼천리 화려강산 대한사람 대한으로 길이 보전하세. 태그는 문단을 구분하는데 개행을 원할경우 태그를 사용해서 줄바꿈을 해주어야 합니다. 블로그에 여러줄의 글을 작성한 뒤에 HTML문서로 변환해 한번 확인해보면 수많은 태그가 생성되어 있는 것을 보실 수 있습니다. 만약 태그로 공백과 엔터를 사용했을때 페이지는 어떻게 표시될까? 아무리 많은 공백과 엔터를 사용한다고 하더라도 ..

HTML 독학을 위한 HTML 표 만들기! <TABLE>, <TR>, <TD>,<TH>

programming/HTML Take-it 2020. 6. 21. 15:47

이번에는 HTML을 가지고 표만들기를 한번 진행해 보도록 하겠습니다. 태그에는 하위로 , , , , , 가 있습니다. 우선 가장 많이 사용되는 태그와 태그에 대해서 한번 알아보겠습니다. 태그의 , 태그 은 큰 표를 만드는 것을 선언으로 안쪽 행열을 구분하여 만들 수 있습니다. 위처럼 1행 3열에 대한 표를 만들고 싶다면 어떻게 소스를 만들면 될까요?? // 테이블 시작! // 1행 만들기 // 1열 시작 // 1열 끝! // 2열 시작 // 2열 끝 // 3열 시작 // 3열 끝 // 1행 끝! // 테이블 끝 1열 ~ 2열 ~ 3열 ~ 결과는 바로 위에 보이는 "1열 ~" 과 같이 한 줄의 표가 완성이 되는 것을 확인하실 수 있습니다. 5행 3열이라면 의 사용은 5번 의 사용은 3번씩 총 15번을 사용..

HTML 독학을 위한 HTML문서 만들기!

programming/HTML Take-it 2020. 6. 18. 22:27

HTML이 무엇이고 기본 구조가 어떻게 되어있는지에 대해서 공부했습니다! 그럼 한번 HTML문서를 만들어보는 시간을 가져보겠습니다. HTML문서를 만들때 웹 에디터를 가지고 HTML문서를 만들 수 있지만 한글, 워드 문서작업 프로그램으로도 만들 수 있고 윈도우에서 기본으로 제공하는 메모장을 활용해도 HTML문서를 만들 수 있습니다. 메모장으로 HTML문서 만들기 일단 HTML문서 에디터를 다운로드 받거나 하지 않고도 바로 할 수 있는 메모장을 이용해 HTML문서를 만들어 보겠습니다. 메모장을 실행시켜 봅니다~ 아무것도 없는 메모장에 지난 시간에 공부한 기본 구조를 그대로 작성을 한번 해보시면됩니다. 우선 메모장에 지난시간에 배운 기본 구성을 그대로 작성해주세요 자 다음으로 태그와 태그를 사용해 봅시다! ..

1

Copyright © take-it 자유로운 블로그 All Rights Reserved

Designed by JB FACTORY

티스토리툴바