HTML5
-
0 5676 Bootstrap modal 사이즈 및 위치 조절
Bootstrap modal 사이즈 및 위치 조절Bootstrap의 자바스크립트 기능 중 하나인 modal 사용법을 간단하게 소개하고 CSS 클래스 조정을 통해 화면 가…
-
0 3550 동그라미 안에 숫자 넣기
동그라미 안에 숫자 넣기 <style type="text/css"> .circle1 { width:200px; height:200px; border-radius:100px; -moz-border-radius : 100px; -webkit-bor…
-
0 1598 [동영상강의] html01_개발환경설정(이클립스, 톰캣 설치, 이클립스 설정), html의 개요
* 컴퓨터 초기화 : 개인 데이터 백업 , IP 주소 메모 * 실습에 필요한 프로그램 설치( 원활한 실습을 위해 디렉토리를 통일할 것 ) * JDK…
-
0 1556 [동영상강의] html10_css_박스모델( border 관련 스타일, padding, margin )
https://developer.mozilla.org/ko/docs/Web/CSS/border-style border-style속성은 element's 국경의 네면에 대한 선 스타일을 설정하는 약…
-
0 1463 [동영상강의] html03_이미지맵, svg 벡터이미지
* SVG(Scalable Vector Graphics) - XML-벡터 기반의 이미지 포맷 - 1999년에 표준 규격 발표 - 픽셀로 구성된 raster(래스터) 그래픽 방식의 단점인 확…
-
0 1430 [동영상강의] html06_오디오, 비디오 태그, 라디오 버튼, 체크박스
checkf.html <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Co…
-
0 1380 부트스트랩 – 반응형 이미지
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 1236 반응형 로그인 페이지
반응형 로그인 페이지 <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link r…
-
0 1227 모바일 웹 개발 - 아이폰 폰트 크기 문제
모바일 웹 개발 시, 특정 사이즈 이상의 모바일 화면에서 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; …
-
팝업 빔
<!doctype html> <html lang="ko"> <head> <style> #web_header_wrap{ z-index: 9999; } .dim-layer { display: block; position: fixed; …
-
textarea 에 데이터를 입력후 웹표준에서 < , 따옴표 등 xss 처리 문제시
1. input 태그에 데이터를 넣는다.jsp 에서는 escapeXml true 옵션을 주어 처리한다. 2. 자바스크립트로, \n 는 br 로 변경해 주며,…
-
페이징 화살표
https://www.toptal.com/designers/htmlarrows/ <ul class="pagination"> <c:if test="${map.pager.curBlock > 1 }"&…
-
아이콘 사이트 목록
구글 폰트 아이콘: https://fonts.google.com/icons w3schools 아이콘 : https://www.w3schools.com/icons/…
-
부트스트랩 5분할 나누기, 5개 그리드로 나누기
부트스트랩 5분할 나누기 부트스트랩의 그리드 시스템은 12개의 분할된 화면으로 레이아웃을 구성하는 것입니다.5개씩 하려고 하면 안되…
-
랜덤 이미지 생성, 에러 이미지 설정
https://picsum.photos/ https://via.placeholder.com random 임의 증가값<img class="card-img-top" src="https://picsum.pho…
-
부트스트랩 navbar
navbar.css<style> .navbar-default { background-color: #2b56be; border-color: #2248a5; } .navbar-default .navbar-brand { color: #fff; } .navbar-default .navbar-nav>li…
-
웹표준 사이트 만들기 ( Webstoryboy) - 4 css footer 꾸미기, 슬릭 슬라이드 배너 적용, 메뉴 토글 적용, 슬릭 무비 갤러리 적용
강의 목록 : https://www.youtube.com/playlist?list=PL4UVBBIc6giKkfYN_2TVPgbMpd87lJEfg 01. 웹표준 사이트 만들기 - 기본 셋팅하기02. 웹표준 …
-
웹표준 사이트 만들기 ( Webstoryboy) - 3 css 탭 메뉴 꾸미기, gallery 만들기, 로그인 form 만들기
강의 목록 : https://www.youtube.com/playlist?list=PL4UVBBIc6giKkfYN_2TVPgbMpd87lJEfg 01. 웹표준 사이트 만들기 - 기본 셋팅하기02. 웹표준 …
-
웹표준 사이트 만들기 ( Webstoryboy) - 2 CSS Navigation Bar 꾸미기, 배너 슬라이드
강의 목록 : https://www.youtube.com/playlist?list=PL4UVBBIc6giKkfYN_2TVPgbMpd87lJEfg 01. 웹표준 사이트 만들기 - 기본 셋팅하기02. 웹표준 …
