티스토리

부지런한 개발자

검색하기

블로그 홈

부지런한 개발자

nanbuja.com/m

재테크하는 개발자의 기록

구독자: 22

방명록 방문하기

주요 글 목록

[HTML5] header / nav / footer / section / article / figure 의 사용법 ▶ header / nav / footer / section / article / figure 의 사용법 빨간 네모는 영역입니다. 페이지명(로고)와 다른 페이지로 이동하기 위한 네비게이션을 담고있습니다. 말그대로 '머릿글'이며, 웹 페이지영역에서 해당 부분의 머리글역할을 합니다. 태그를 담는 용도로도 사용이됩니다. 주로 메뉴들을 담는 역할을 하며 다른 페이지로 navigate(nav)해주는 역할을 합니다. 영역입니다. 다른 페이지로 이동하기 위한 네비게이션입니다. 영역입니다. 태그와 태그는 나누기가 나름이지만, 어떤 부분에 사용되는지에 대해 이해를 돕기위해서 임의로 구분을해봤습니다. 영역입니다. 본내용들이 들어가는 부분이라고 생각하시면 됩니다. 영역안에서 또 영역이 나눠지는데 밑에 사진에서 설명드리겠습니.. 공감수 5 댓글수 0 2019. 8. 12.
[HTML] div태그와 span태그의 사용법과 차이점 ▶ div태그와 span태그의 사용법과 차이점 div 공간 분할 div 첫 번째 영역입니다. div 두 번째 영역입니다. div 세 번째 영역입니다. span 공간 분할 span 첫 번째 영역입니다. span 두 번째 영역입니다. span 세 번째 영역입니다. 와 태그를 실습해보겠습니다. 구역 구별이 가능하게 style로 뒷배경을 색상을 넣어봤습니다. div는 해당 가로글이 모두 적용이 되는걸 확인할 수 있는 반면에, span은 inline으로써 옆으로 붙는걸 확인할 수 있습니다. div 공간 분할 div 영역. span 첫 번째 영역입니다. div 영역. span 두 번째 영역입니다. div 영역. span 세 번째 영역입니다. div영역에 pink를 주고 그안에 span을 넣어주고 그리고나서 로 태그.. 공감수 4 댓글수 2 2019. 8. 11.
[HTML] form태그와 fieldset / legend태그 및 속성 (method, name, action, onsubmit, target) ▶ form태그와 fieldset / legend태그 및 속성 (method, name, action, onsubmit, target) 잘 넘어오나 위 소스는 아래 태그의 속성인 action이 잘 사용되는지 확인하기위한 페이지입니다. 간단하게 "잘 넘어오나"라는 문구만 입력한 test.html입니다. 이름 주소 태그에서 action속성을 사용해보겠습니다. 안에 action속성으로 기존에 위에서 만든 test.html을 넣어줍니다. 저번시간에 실습했던 태그에서는 reset과 submit버튼이 작동하지않았는데요 이번에는 정상작동이 되는걸 확인하실수 있습니다. 그이유는 reset과 submit버튼은 반드시 태그안에 작성되어야 작동이 됩니다. 초기화 버튼 클릭시 입력된 이름과 주소가 사라지고, 전송을 버튼 클릭.. 공감수 3 댓글수 0 2019. 8. 10.
[HTML] input태그 및 속성 (type, text, password, hidden, radio, checkbox, search, number) 사용법 ▶ input태그 및 속성 (type, text, password, hidden, radio, checkbox, search, number) 사용법 태그는 에 작성하고, type은 위에서 많은 종류가 있지만, 위 소스에서는 button부터 checkbox까지를 사용해봤습니다. 어떤 type을 사용할것인지 괄호안에 작성해주고, 버튼을 사용한다면 안에 입력될 글자를 value속성을 사용해서 작성해줍니다. 지금은 submit과 reset버튼이 모두 작동이 안되고 버튼과 같아보이지만, 이 두개 버튼은 태그편에서 설명해드리겠습니다. ( 이때, 괄호는 소괄호 or 중괄호 둘중에 아무거나 사용하면됩니다. ) 10대 20대 30대 40대 이번에는 type을 redio만해서 사용해봤습니다. name속성에 age를 작성해.. 공감수 2 댓글수 0 2019. 8. 9.
[HTML] ul / li / ol / dl / dt / dd 사용법 ▶ ul / li / ol / dl / dt / dd 사용법 좋아하는 것 스포츠영화 스포츠영화 스포츠영화 스포츠영화 실험 결과를 보며 실습하겠습니다. * 순서가 매겨지지 않는 태그입니다. 단순하게 목차라고 생각하시면됩니다. 아무 속성도 주지않을경우, 기본값으로 꽉찬 동그라미가 나옵니다. type에 circle 속성을 이용하면 구멍이난 동그란모양이 나옵니다. square속성은 꽉찬 네모가 나옵니다. * ul에 들어가는 속성(문구)라고 생각하시면됩니다 좋아하는 것 스포츠 영화 스포츠 영화 스포츠 영화 스포츠 영화 * 태그는 과 달리 순서가 매겨지는 태그입니다. 위에서 보는바와 같이 기본값으로 숫자가 만들어집니다. type 으로 a를 주고 start를 3부터 주면 a,b,c순으로 c가 먼저시작되기에 c와 d순.. 공감수 2 댓글수 0 2019. 8. 8.
[HTML] img태그 (이미지넣기) 사용법 ▶ img태그 (이미지넣기) 사용법 우선, 이미지를 넣기를 실습하기위해서 사진을 .jpg 또는 .png 등을 로컬 바탕화면에 저장한후, 위처럼 "WebContent"디렉토리에 해당 사진파일을 드래그해서 올려놓습니다! 하고나면 위사진처럼 test.jpg가 "WebContent"디렉토리안에 위치하게됩니다. 이미지 삽입하기 글자도 써 봅니다. 그림을 기준으로 글자가 중앙에... alt속성은 만약에 이미지가 오류 or 경로가 잘못되었을때 등을 대비하여 이미지를 대신해서 텍스트가 삽입됩니다. 현재는 문제발생이 되지않아 정상적으로 화면에 사진이 출력됩니다. 공감수 2 댓글수 0 2019. 8. 7.
[HTML] a태그 (주소 링크 달기) 사용법 및 속성 ▶ a태그 (주소 링크 달기) 사용법 및 속성 네이버 네이버 네이버 문서에 링크한다. 빈 링크를 만들고싶다면, 빈 링크 사용해주면됩니다. 이미지를 넣는 방법을 모르신다면, 아래 " 태그 "편을 참고해주세요. 공감수 2 댓글수 0 2019. 8. 6.
[HTML] table / caption / tr / td / th / colspan / rowspan / cellpadding / cellspacing 테이블만들기 ▶ table / caption / tr / td / th / colspan / rowspan / cellpadding / cellspacing 테이블만들기 테이블에 대한 제목 할일 영어국어미술 과학영어 공감수 2 댓글수 0 2019. 8. 5.
[HTML] h / font / br & 주석처리 ● HTML : HTML을 생성하면 기본적으로 완성되는 소스입니다. 은 "저는 html입니다"라고 알리는것과 같습니다. 주로, 설정값들이 많이들어갑니다. ● 주석이란? : 로직에 대한 설명이나 코드를 비활성화 할때 사용한다. 프로그래밍적으로 해석되지않는다. 사용방법 : (아래 소스에서 " "이런식으로 실습해봤습니다.) 이렇게 입력된건 주석을 표현하는 방식입니다. 공감수 2 댓글수 0 2019. 8. 4.
[HTML] dfn/ strong / strike / b / i / u / center / sup / sub / br / p / pre / hr 사용법 ▶ dfn/ strong / strike / b / i / u / center / sup / sub / br / p / pre / hr 사용법 이 글자는 용어 정의 이 글자는강한 강조 표시 이 글자는 삭제표시 이 글자는 굵은글씨 이 글자는이태릭(기울임) 이 글자는 밑줄효과 이 글자는중간정렬효과 이 글자는위 첨자 이 글자는아래 첨자 * : 용어를 정의해주는 역할입니다. * : 강한 강조표시를 해주는 역할입니다. : 삭제를 표시해줍니다. * : 굵은 글씨를 만들어줍니다. * : 기울임을 나타내줍니다. * : 밑줄을 그어주는 밑줄효과입니다. * : 중간에 정렬되는 효과를 가지고있습니다. * : 위첨자로써의 역할을 합니다. * : 아래첨자로써의 역할을 합니다. 공백을 넣어보세요...공백 및 공백라인이 적용될까요.. 공감수 2 댓글수 0 2019. 8. 3.
[HTML] Problem Occurred('Starting Tomcat v8.0 Server at localhost' has encountered a problem) 에러 해결 ▶Problem Occurred('Starting Tomcat v8.0 Server at localhost' has encountered a problem) 에러 해결 'Starting Tomcat v8.0 Server at localhost' has encountered a problem. Port 8080 required by Tomcat v8.0 Server at localhost is already in use. The server may already be running in abnother process, or a system process may be using the port. To start this server you will need to stop the other process or.. 공감수 3 댓글수 0 2019. 8. 2.
[HTML] 아톰(atom)설치방법 및 설정 & 출력해보기 (무료 웹 에디터) ▶ 아톰(atom)설치방법 및 설정 & 출력해보기 (무료 웹 에디터) ● 아톰(Atom)이란? : 다양한 프로그래밍 언어의 편집이 가능한 편집기입니다. 패키지를 통해 사용자 편의에 맞도록 커스터마이징할 수 있습니다. ( 이클립스, 비쥬얼 스튜디오와 같은 하나의 에디터라고 생각하시면 됩니다! ) ● 아톰 특징 1. 무료 웹 에디터로써 많은 사람들에게 사랑을 받고 있는 editor입니다. 2. 플러그인으로 간편하게 패키지를 설치할 수 있고 기능을 확장할 수도 있습니다. 3. 모든 운영체제 (Window, Linux, Mac OS)에 모두 설치가 가능합니다. 4. 디자인이 깔끔하고 화면 분할기능이 있어 많은 사랑을 받고있습니다. 5. HTML, CSS, JavaScript를 손쉽게 사용이가능하고 사용자 편.. 공감수 5 댓글수 1 2019. 8. 1.
[HTML] html의 개념과 설치&사용방법 ( 아파치 톰캣 다운로드 / 설치방법 ) ▶ html의 개념과 설치&사용방법 ( 아파치 톰캣 다운로드 / 설치방법 ) ● HTML이란? : HTML(Hyper Text Markup Language)은 가장 단순한 웹언어입니다. 웹 문서를 만들기 위하여 사용하는 기본적인 프로그래밍 언어의 한 종류로써, 하이퍼텍스트를 작성하기 위해 개발되었습니다. 확장자를 .html 또는 .htm을 가집니다. ● HTML 구성요소 - 요소(Elements) : 시작 태그와 종료 태그로 이루어진 모든 명령어. - 태그 (Tag) : 요소의 일부, 시작 태그(요소를 시작)와 종료 태그(요소를 끝냄)가 있음. - 속성 (Attributes) : 명령을 구체화 시키는 것으로 요소의 시작 태그 안에서 사용됨. - 변수 (Arguments) : 속성과 관련된 값. HTML을.. 공감수 2 댓글수 0 2019. 8. 1.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.