'웹 프로그래밍/HTML' 카테고리의 글 목록

웹 프로그래밍/HTML (16)

[HTML] HTML iframe 요소

웹 프로그래밍/HTML 범범조조 2020. 12. 18. 00:00

안녕하세요. 오늘은 HTML에서 iframe 요소에 대해서 알아 보려고 합니다. iframe이란 inline frame 의 약자인데요. Iframe 요소를 이용하면 어떠한 제약 없이, 웹페이지 혹인 이미지, 동영상 등을 삽입해서 보여줄 수 있는데요. 예제를 통해서 보여 드리도록 하겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 HTML 연습 - 범범조조 Inline Frame 연습 네이버 페이지로 페이지 변경 Colored by Color Scripter cs 실행 결과 위와 같이 iframe 요소를 이용하여 이미지를 삽입해 보았습니다. 또한, "네이버 페이지로 페이지 변경" 을 클릭하면 해당 홈페이지로 iframe 내에서 페이지가 전환되는..

[HTML] HTML list 태그 CSS 입히기

웹 프로그래밍/HTML 범범조조 2020. 12. 17. 00:00

안녕하세요. 오늘은 HTML에서 지난번 list 태그를 이용하여 리스트 구성하는 방법에 대해서 알려 드린적이 있는데요. 이번에는 CSS를 이용하여 list 태그를 좀더 꾸미는? 방법에 대해서 알려 드리려고 합니다. CSS를 이용하면 여러 디자인으로 리스트를 나타낼 수 있는데요. 예제를 통해서 보여 드리도록 하겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 HTML 연습 - 범범조조 CSS 없는 리스트 바나나 포도 수박 참외 옥수수 CSS 입힌 리스트 바나나 포도 수박 참외 옥수수 CSS 입힌 리스트 바나나 포도 수박 참외 옥 Colored ..

[HTML] HTML 폼 태그 – Label 태그 사용하기

웹 프로그래밍/HTML 범범조조 2020. 12. 16. 00:00

안녕하세요. 오늘은 HTML에서 폼 태그 중, Label 태그 사용하는 방법에 대해서 알아 보려고 합니다. 보통 Label 태그는 이름표라고 이해하시면 되겠는데요. 이전의 간단한 회원가입 화면을 만든 적이 있는데요. 그 소스코드에 Label 태그를 추가해서 어떻게 label 태그를 사용하는지 보여 드리도록 하겠습니다. 그럼 바로 예제 코드를 통해서 알아 보겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 HTML 제목 - 범범조조 label 태그 연습하기 회원가입 화면 이름 : 나이 : 주소 : 핸드폰 번호 : 자기소개 : defa..

[HTML] HTML 폼 태그 – 라디오 버튼(Radio Button), CheckBox 만들기

웹 프로그래밍/HTML 범범조조 2020. 12. 15. 00:00

안녕하세요. 오늘은 HTML에서 폼 태그 중, 라디오 버튼, 체크박스 컨트롤 만드는 방법에 대해서 알아 보려고 합니다. 그럼 바로 예제 코드를 통해서 알아 보겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 HTML 제목 - 범범조조 라디오 버튼, 체크박스 연습하기 과일 (단일선택 하기) 바나나 : 사과 : 포도 : 과일2 (다중선택 하기) 바나나 : 사과 : 포도 : Colored by Color Scripter cs 실행 결과 위와 같이 라디오 버튼과 체크박스 컨트롤이 그려진걸 확인하실 수 있습니다. 감사합니다.^^

[HTML] HTML 폼 태그 – Select 박스(콤보박스) 만들기

웹 프로그래밍/HTML 범범조조 2020. 12. 14. 00:00

안녕하세요. 오늘은 HTML에서 폼 태그 중, Select 박스 혹은 콤보박스 컨트롤 만드는 방법에 대해서 알아 보려고 합니다. 그럼 바로 예제 코드를 통해서 알아 보겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 HTML 제목 - 범범조조 Select 박스 연습하기 과일 바나나 사과 포도 과일2 (다중선택 하기) 바나나 사과 포도 Colored by Color Scripter cs 실행 결과 감사합니다.^^

[HTML] HTML 폼 태그 – 텍스트 입력하기

웹 프로그래밍/HTML 범범조조 2020. 12. 13. 00:00

안녕하세요. 오늘은 HTML에서 폼 태그 중, 텍스트 입력하는 태그에 대해서 알아 보려고 합니다. 앞서, 로그인 폼에서 Text 입력하는 기본적인 방법에 대해서 알아 보았는데요. 이번 포스팅에서는 조금 더 자세히 텍스트 입력하는 방법에 대해서 알아 보도록 하겠습니다. 그럼 바로 예제 코드를 통해서 알아 보겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 HTML 제목 - 범범조조 텍스트 입력 연습하기 이름 : 나이 : 주소 : 핸드폰 번호 : default value Colored by Color Scripter cs 실행 결과 감사합니다.^^

[HTML] HTML 폼 만들기

웹 프로그래밍/HTML 범범조조 2020. 12. 12. 00:00

안녕하세요. 오늘은 HTML에서 폼 만드는 방법에 대해서 알아 보려고 합니다. 가장 기본적으로 로그인 하는 폼을 만들어 보려고 하는데요. 로그인 폼에는 기본적으로 아이디, 비밀번호를 입력하는 컨트롤들이 있어야 겠죠? 이런 컨트롤들 또한 HTML을 이용하여 모두 작성이 가능한데요. 바로 예제 코드를 통해서 확인해 보도록 하겠습니다. 참고로, 저는 모든 HTML 공부를 생활코딩 사이트에서 하고 있다는점! 참고해주세요~~ 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 HTML 제목 - 범범조조 로그인 폼 만들기 아이디 : 비밀번호 : 주소 : Colored by Color Scripter cs 실행 결과 위와 같이 “제출” 버튼을 누르게 되면, 해당 action 으..

[HTML] HTML 테이블 만들기

웹 프로그래밍/HTML 범범조조 2020. 12. 11. 00:00

안녕하세요. 오늘은 HTML에서 테이블 만드는 방법에 대해서 알아 보려고 합니다. 테이블, 표 라고도 하죠? 엑셀을 이용하시는 분들은 매우 잘 아실거라 생각이 드는데요. 이 표를 HTML 코드를 이용해서 만들 수도 있습니다! 말로 하는 것 보다는 당연히 소스코드를 통해 보는게 훨씬 좋겠죠?ㅎㅎ 바로 예제 코드를 통해서 확인해 보도록 하겠습니다. 저는 Student 테이블 하나를 만들어 보도록 하겠습니다. 예제 코드 12345678910111213141516171819202122232425262728293031323334353637 HTML 제목 - 범범조조 Student Table 이름 나이 주소 핸드폰 번호 범범조조 28 수원 010-1111-2222 아이유 28 서울 010-2222-5555 정형돈 ..

[HTML] HTML img 태그 – 이미지 태그

웹 프로그래밍/HTML 범범조조 2020. 12. 10. 00:00

안녕하세요. 오늘은 HTML에서 img 태그에 대해서 알아 보려고 합니다. img 태그는 한마디로 이미지를 웹에 포함해주는 태그인데요. 말로 하는 것 보다는 당연히 소스코드를 통해 보는게 훨씬 좋겠죠?ㅎㅎ 바로 예제 코드를 통해서 확인해 보도록 하겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 HTML 제목 - 범범조조 이미지 넣는 연습 Colored by Color Scripter cs 실행 결과 위와 같이 줄 바꿈이 되어 출력되는 것을 확인하실 수 있습니다. 감사합니다.^^

[HTML] HTML br 태그 – 줄 바꿈 태그

웹 프로그래밍/HTML 범범조조 2020. 12. 9. 00:00

안녕하세요. 오늘은 HTML에서 br 태그에 대해서 알아 보려고 합니다. br 태그는 한마디로 줄 바꿈을 태그인데요. 말로 하는 것 보다는 당연히 소스코드를 통해 보는게 훨씬 좋겠죠?ㅎㅎ 바로 예제 코드를 통해서 확인해 보도록 하겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 HTML 제목 - 범범조조 안녕하세요. 저는 범범조조입니다. 지금 현재 HTML을 공부중이며 지금은 매우 기본적인 내용들을 학습합니다. 그렇지만, 무엇이든지 기본이 제일 중요한법 아니겠어요?ㅎㅎ 기본만 충실하면 뭐든 못 할게 없다고 생각합니다. 우리 모두 시작이 반이라고! 열심히 해서 CSS, JavaScript, ASP.NET 까지 열심히 배워서 웹도 개발..

[HTML] HTML p 태그 – 단락

웹 프로그래밍/HTML 범범조조 2020. 12. 8. 00:00

안녕하세요. 오늘은 HTML에서 p 태그에 대해서 알아 보려고 합니다. p 태그는 한마디로 단락을 구분하는 태그인데요. 말로 하는 것 보다는 당연히 소스코드를 통해 보는게 훨씬 좋겠죠?ㅎㅎ 바로 예제 코드를 통해서 확인해 보도록 하겠습니다. 예제 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 HTML 제목 - 범범조조 안녕하세요. 저는 범범조조입니다. 지금 현재 HTML을 공부중이며 지금은 매우 기본적인 내용들을 학습합니다. 그렇지만, 무엇이든지 기본이 제일 중요한법 아니겠어요?ㅎㅎ 기본만 충실하면 뭐든 못 할게 없다고 생각합니다. 우리 모두 시작이 반이라고! 열심히 해서 CSS, JavaScript, ASP.NET 까지 ..

[HTML] HTML 기본 웹 페이지 만들기

웹 프로그래밍/HTML 범범조조 2020. 12. 7. 00:00

안녕하세요. 오늘은 여태까지 배웠던 몇 개의? 기본 태그들을 이용하여 이제는 진짜 기본 웹 페이지를 만들어 보도록 하겠습니다! 웹 페이지라고 해서 막 엄청 거창한건 아니고 기본 페이지가 있고, 기본 페이지에서 표시되어 있는 텍스트를 클릭하면 그거에 맞는 페이지로 링크가 연결되어 페이지가 열리고 다시 원래 페이지로 왔다갔다 하는 아주 기본적인 웹 페이지를 만들어 보도록 하겠습니다. 참고로, 저는 모든 공부는 생활코딩을 통해서 했다는점! 참고해 주세요~~ default.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 HTML 제목 - 범범조조 범범조조 블로그 카테고리1 카테고리1 카테고리1 카테고리1 카테고리1 첫 페이지 안녕하세요. 지금 보고 ..

1
2

Sidebar

Copyright © BeomBeomJoJo All Rights Reserved

Designed by JB FACTORY

티스토리툴바