HTML5
-
0 5684 Bootstrap modal 사이즈 및 위치 조절
Bootstrap modal 사이즈 및 위치 조절Bootstrap의 자바스크립트 기능 중 하나인 modal 사용법을 간단하게 소개하고 CSS 클래스 조정을 통해 화면 가…
-
0 3568 동그라미 안에 숫자 넣기
동그라미 안에 숫자 넣기 <style type="text/css"> .circle1 { width:200px; height:200px; border-radius:100px; -moz-border-radius : 100px; -webkit-bor…
-
0 1607 [동영상강의] html01_개발환경설정(이클립스, 톰캣 설치, 이클립스 설정), html의 개요
* 컴퓨터 초기화 : 개인 데이터 백업 , IP 주소 메모 * 실습에 필요한 프로그램 설치( 원활한 실습을 위해 디렉토리를 통일할 것 ) * JDK…
-
0 1562 [동영상강의] html10_css_박스모델( border 관련 스타일, padding, margin )
https://developer.mozilla.org/ko/docs/Web/CSS/border-style border-style속성은 element's 국경의 네면에 대한 선 스타일을 설정하는 약…
-
0 1469 [동영상강의] html03_이미지맵, svg 벡터이미지
* SVG(Scalable Vector Graphics) - XML-벡터 기반의 이미지 포맷 - 1999년에 표준 규격 발표 - 픽셀로 구성된 raster(래스터) 그래픽 방식의 단점인 확…
-
0 1431 [동영상강의] html06_오디오, 비디오 태그, 라디오 버튼, 체크박스
checkf.html <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Co…
-
0 1387 부트스트랩 – 반응형 이미지
Head<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3…
-
1 1329 HTML/CSS?마우스 커서 모양(스타일) 바꾸기
HTML/CSS 마우스 커서 모양(스타일) 바꾸기 웹페이지를 HTML과 CSS를 이용해서 만들다 보면 각 상황에 …
-
0 1239 반응형 로그인 페이지
반응형 로그인 페이지 <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link r…
-
0 1233 모바일 웹 개발 - 아이폰 폰트 크기 문제
모바일 웹 개발 시, 특정 사이즈 이상의 모바일 화면에서 font-size가 크게 보이는 경우가 있어요.아이폰의 경우 뷰포트가 변경이 되면 자동으로 폰…
-
7 부트스트랩 – 반응형 이미지
Head<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3…
-
7 동그라미 안에 숫자 넣기
동그라미 안에 숫자 넣기 <style type="text/css"> .circle1 { width:200px; height:200px; border-radius:100px; -moz-border-radius : 100px; -webkit-bor…
-
5 Bootstrap modal 사이즈 및 위치 조절
Bootstrap modal 사이즈 및 위치 조절Bootstrap의 자바스크립트 기능 중 하나인 modal 사용법을 간단하게 소개하고 CSS 클래스 조정을 통해 화면 가…
-
4 1. HTML5의 구조 및 기본 지식 익히기
1. HTML5의 구조 및 기본 지식 익히기 HTML5를 학습하는데 있어 기본적인 내용을 설명하기에 앞서 먼저 HTML5의 특징을 간략하게 요약하면 다음과 …
-
4 JSP, HTML 캐쉬 없애기!
가끔 jsp페이지를 클릭했는데 삭제 하였음에도 불구하고 기존에 존재했던 데이터가 그대로 보여지는 경우가 있다 이같은 …
-
4 open CDN jsdelivr github 사용으로 트래픽 감소 속도업
다음예와 같이 적용하면 된다.gh/아이디/프로젝트명@버전/ 파일https://cdn.jsdelivr.net/gh/braverokmc79/easyk@1.0.…
-
4 HTML/CSS?마우스 커서 모양(스타일) 바꾸기
HTML/CSS 마우스 커서 모양(스타일) 바꾸기 웹페이지를 HTML과 CSS를 이용해서 만들다 보면 각 상황에 …
-
4 페이징 화살표
https://www.toptal.com/designers/htmlarrows/ <ul class="pagination"> <c:if test="${map.pager.curBlock > 1 }"&…
-
4 textarea 에 데이터를 입력후 웹표준에서 < , 따옴표 등 xss 처리 문제시
1. input 태그에 데이터를 넣는다.jsp 에서는 escapeXml true 옵션을 주어 처리한다. 2. 자바스크립트로, \n 는 br 로 변경해 주며,…
-
4 팝업 빔
<!doctype html> <html lang="ko"> <head> <style> #web_header_wrap{ z-index: 9999; } .dim-layer { display: block; position: fixed; …
-
[동영상강의] html01_개발환경설정(이클립스, 톰캣 설치, 이클립스 설정), html의 개요
* 컴퓨터 초기화 : 개인 데이터 백업 , IP 주소 메모 * 실습에 필요한 프로그램 설치( 원활한 실습을 위해 디렉토리를 통일할 것 ) * JDK…
-
[동영상강의] html02_html 기본 태그(표 그리기, 이미지, 하이퍼링크 등)
test.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html > <html> <head> <meta http-equiv="Cont…
-
[동영상강의] html03_이미지맵, svg 벡터이미지
* SVG(Scalable Vector Graphics) - XML-벡터 기반의 이미지 포맷 - 1999년에 표준 규격 발표 - 픽셀로 구성된 raster(래스터) 그래픽 방식의 단점인 확…
-
[동영상강의] html04_form(get, post 방식, request.getParameter, tcp/ip 모니터)
form.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <!-- form : …
-
[동영상강의] html05_form(로그인 기능을 jdbc로 구현)
radiof.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <!-- radio…
-
[동영상강의] html06_오디오, 비디오 태그, 라디오 버튼, 체크박스
checkf.html <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Co…
-
html07_버튼, 이미지 버튼, textarea, select, 다양한 input 태그, progress
select.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <!-- 스타일시트 --> <style type="text/…
-
[동영상강의] html09_css_선택자, id와 class, css를 사용하는 방법, font 관련 스타일, text 관련 스타일
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style> /* class 가 type1 인 …
-
[동영상강의] html10_css_박스모델( border 관련 스타일, padding, margin )
https://developer.mozilla.org/ko/docs/Web/CSS/border-style border-style속성은 element's 국경의 네면에 대한 선 스타일을 설정하는 약…
