HTML

[eclipse] Edit Template(JSP 템플릿)

HTML이나 JSP파일을 만들때 기본 설정을 매번 해주기 너무 귀찮은 노릇이죠...! 혹시 매번 쓰는 설정은 미리 한번에 해두는 방법은 없을까요?? 당연히 있습니다! JSP의 경우 인코딩을 해줘야 한글이 깨지지 않기때문에 매번 인코딩 코드를 삽입을 해줘야하는데요. 이런 경우 파일을 만들때마다 해당 코드가 삽입되어있도록 만들어주면 참 편하겠죠?? 우선은 JSP파일을 만들기 단계로 와주세요! 프로젝트 혹은 디렉터리 우클릭하고 new > JSP file 선택하는거 아시죠?! 위에서 next를 누르면 이런 화면이 나올거에요! 벌써 뭔가가 설정하는 단계처럼 보이지 않나요?! 아래쪽에 파란색으로 JSP Templates라고 나와있는 글자를 클릭해주세요! 뭔가가 템플릿이 되게 많네요! JSP뿐만아니라 HTML파일도 ..

[Django] 장고 이용하여 페이지 구성하기

path('for', views.forLoop), def forLoop(request): return render(request, 'for.html', {'number':range(1, 10)}) {% for num in number %} {{num}} {% endfor %} if01 {% if user.id %} Hello, {{user.name}}!! {% endif %} def if01(request): return render(request, 'if01.html', {'user':{'id':'qclass','name':'myname'}}) path('if01', views.if01), {% if role == 'admin' %} Admin page {% elif role == 'manager' %..

[Django] 장고 이용하여 페이지 구성하기02

python manage.py startapp hello02 settings.py에 54번째줄을 보면 TEMPLATES가 있습니다. 여기 DIRS의 배열에 [BASE_DRI/'templates']를 적어주세요 hello아래 hello02.html파일을 만들고 해달 내용을 작성했습니다. 파일을 만들고 html5를 누르면 템플릿이 자동으로 완성됩니다. 에 Hello, {{name}}!! 만 작성해주세요. from django.shortcuts import render # Create your views here. def hello(request): return render(request, 'hello02.html', {'name':'django'}) hello02폴더에 있는 views에 해당 코드를 작성합니..

[Django] 장고 이용하여 페이지 구성하기01

​ django-admin startproject hello hello라는 폴더가 생겼네요. 그 hello안에 hello에 views.py라는 파일을 만들어주세요. ​ from django.http import HttpResponse def index(request): return HttpResponse('hello, world!') ​ ​ urls.py에 아무것도 없는 경로가 들어오면 views에 있는 index를 실행시켜달라는 의미의 코드를 작성합니다. from . import views를 작성하지 않으면 views가 뭔지 몰라서 인식을 못하고 노란색 줄이 뜨기 때문에 작성해주세요! ​ ​ cd hello python manage.py runserver ​ 혹시 포트를 바꾸고 싶다면 python ma..

[HTML] 테이블(table)

1. 테이블 - 문서에 표를 작성할 때 사용 - 주요 속성 rowspan : 수직방향으로 셀 병합 colspan : 수평방향으로 셀 병합 - 테이블 주요 구성 태그 : 행 정의, th와 td만 자식요소로 포함 : 제목 셀 정의 : 데이터 셀 정의 : 테이블의 머리글 : 테이블의 본문 : 테이블의 바닥글 : 테이블 제목 : 테이블 열 정의 : 테이블의 열 그룹화 ​ ​ ​ 01. 기본 테이블 만들기 컬럼1 컬럼2 1 2 3 4 02. 주요 태그 사용해서 만들기 테이블 제목 컬럼 1 컬럼 2 컬럼 3 1 2 3 4 5 6 7 8 9 footer1 footer2 footer3 03. 테이블 셀 병합하기 컬럼1컬럼2컬럼3컬럼4 1 2 3 4 6 7 9

[HTML] 리스트(list)

1. 리스트(list) 기본 목록 구성 - 주로 메뉴 작성시 사용 ​ : 비 순차적 목록 나열 : 순차적 목록 나열 : 목록의 내용 ​ , , 는 주로 이미지를 입력하고 그에 대한 설명을 입력하는 것 등에 사용됨 : 목록을 시작하고 end 태그로 끝냄 (목록의 범위, 영역) : 타이틀 목록 작성 : 목록에 대한 설명 ​ ​ 목록 순차적 목록 학원 가는 순서 기상 씻기 양치하기 머리감기 세수하기 머리말리기 옷갈아입기 출발 버스정류장가기 버스타고 지하철역 가기 지하철타고 역삼역까지 가기 역삼역에서 학원까지 걸어가기 학원도착 집 가는 순서 학원에서 역삼역까지 간다 역삼역에서 답십리역까지 간다 답십리역에서 집까지 가는법 버스타기 자전거타기 킥보드타기 걸어가기 택시타기 정의형 목록 제목 내용 QClass 강의시간..

[HTML] 링크(link <a>)

1. 링크 - 텍스트나 이미지 등을 통해 다른 페이지로 정보 연결 - 인라인 요소(인라인 요소와 텍스트를 포함) - 주요 속성 href : 링크의 주소 지정 title : 링크의 설명 표시 target : 링크된 문서를 어떤 창에서 오픈할 것인지 지정 a tag naver 1번 2번 3번 1번 2번 3번 naver를 누르면 실제 네이버로 넘어가고 1번, 2번, 3번은 누르면 해당 페이지 아래로 이동합니다!

[HTML] 텍스트(text), 이미지(img)

1. 텍스트 표현 요소 : 텍스트 진하게 : 텍스트 진하게 : 텍스트 기울임 : 텍스트 기울임 : 작은 텍스트 표시, 코멘트 등 : 아래 첨자 : 윗 첨자 : 내용 추가 : 내용 삭제 ​ ​ ​ 2. 이미지 - 주요 속성 alt : 이미지를 설명하는 내용 지정. 이미지가 보이지 않을 경우, 이미지 설명 텍스트 width : 이미지의 가로 크기 지정 height : 이미지의 세로 크기 지정 src : 이미지 경로 지정 ​ ​ ​ 이미지의 경로를 지정해 줄때 해당 경로에 반드시 이미지가 있어야 출력됩니다! TEXT 진하게() 진하게() 기울임() 기울임() 작은 텍스트 표시, 코멘트() 윗 첨자() 아래 첨자() 내용 추가 () 내용 삭..

[HTML] 구분선(hr), 인용문(quotation)

1. 구분선(Horizontal line) - 블록요소이지만, 빈 요소이기에 종료 태그가 없음 - css 대신 내용 구분할 때 주로 사용 ​ ​ 2. 인용문(Quotation) - 다른 사이트에서 인용한 일부를 지정 - 블록요소인 p요소를 사용합니다. - cite 속성 : 인용문의 출처 / cite 요소 : 작품의 제목 ​ - 짧은 인용문 지정 - 텍스트나 인라인 요소 포함 ​ ​ blockquote 드래곤라자라는 소설에서, 내가 좋아하는 말이 있습니다. 드래곤 라자 나는 단수가 아니다. q 드래곤라자라는 소설에서, 내가 좋아하는 말이 있습니다. 나는 단수가 아니다.

[HTML] 제목, 단락, 주소

1. 제목태그 : ~ (총 6개) - 문서 내부의 컨텐츠 제목을 정의 - 순서에 맞게 작성 - css로 임의의 크기 지정 가능 - h1은 한 문서에 한번만 지정하는 것을 권장 ​ ​ 2. 단락(paragraph) - 블록 요소 (다른 블록 요소 포함 불가) ​ - 문단 간격 정의 태그. 개행요소. 빈 요소(종료 태그x) ​ ​ 3. 주소 : - 연락처 정보 나타내는 요소 - 블록요소 (다른 블록요소 포함 불가) 단, DTD가 'transitional'인 경우 포함 가능 ​ ​ 제목 글자 크기 지정 하는 태그 p 요소는 단락을 정의 div요소는 영역을 정의 인라인 요소와 텍스트 요소를 포함할 수 있는 블록요소이지만, 또 다른 블록요소를 포함할 수는 없다. 연락처 : 010-1234-5678 ​