LATEST POSTs 최근 등록된 포스팅 목록 최신순

---

인기순

• html [CSS] 태그의 스크롤바 지정 및 삭제하기, div, iframe 스크롤바를 지정 및 삭제(숨기기, 안보이게 하기)하는 방법입니다. 스크립트를 사용해 반응형 웹을 만들때 많이 사용됩니다. 참고로 IE 8 이하에서는 overflow가 안되니 스크립트를 쓰거나 position을 relative로 바꿔주는 등 다른 우회 방법을 찾으셔야 합니다^^Ex)- 문서태그의 경우overflow-x: none; // 좌우 스크롤바 숨기기overflow-y: none; // 상하 스크롤바 숨기기overflow: auto; // 스크롤바 생성- i

  View : 6551 / 2014-01-25
• php [PHP] 이전 페이지 주소 불러오기 PHP 언어를 사용해 이전 페이지로 돌아가기 위한 방법을 알아보려고합니다. 어떻게하면 PHP에서 이전 페이지로 돌아갈 수 있을까요?우선 왜 이전페이지로 돌아가기 위한 방법이 필요할까요? 그 이유는 다양할 수 있습니다. 대표적인 경우를 예로 들어보면 아래와 같을 것입니다.<span data-custom

  View : 21591 / 2014-01-25
  
• webdevetc 인터넷 익스플로러 8 (IE8) 이하에서 색상 적용 안되는 문제, rgba() ie 8(익스플로러 8) 이하에서 색상(칼라)이 적용이 안되는 문제가 발생해 이유를 알아봤더니 칼라를 지정하는 속성 값 때문이더군요. 배경 또는 폰트 색상을 지정하기 위해 보통 아래의 방법을 사용합니다. 그런데 4번째 방법인 rgba값은 IE8 이하에서 적용이 안되기때문에 다른 방법을 사용해야 합니다. 아래 예제를 참고하세요. Example <style>color: #fff; 또

  View : 2354 / 2014-01-24
• webdevetc [SVN] 파일 삭제 및 추가, delete, add 터미널을 이용하여 서버에 있는 파일을 삭제하거나 추가하기 위한 명령어입니다. 우선 아래와 같이 해당 파일에 대하여 삭제 및 추가를 할 것이라고 add 또는 delete 명령어를 사용해 선언을 한 후 서버에 커밋 명령어를 수행합니다. 그럼 아래 예제를 보세요!하나. 파일 또는 삭제 될 것이라 선언; 자신의 로컬(컴퓨터)에 있는 파일을 단순하게 삭제하고 커밋 명령을

  View : 12363 / 2014-01-24
• webdevetc [SVN terminal] commit, 서버에 업데이트 반영하기 svn에서 서버에 작업한 수정 사항을 서버에 업데이트 하는 명령어로 커밋(Commit)을 수행합니다. 커밋은 자신의 pc인 로컬에 작업내용을 업로드합니다. svn status를 통해 현재 변경된 내용을 확인할 수 있으며 작업 내용이 있는 경우 아래의 명령어를 통해 서버에 업로드 합니다.svn commit -m "Comment here"-m 뒤는 남길 코멘트로 어떤 작업인지 내용을 간략하게 남길 수 있습니다.참고로 commit

  View : 2421 / 2014-01-24
• webdevetc [SVN] 특정 파일의 수정자를 행 단위로 확인하기, blame 형상관리 중 하나인 svn에서 커밋을 한 사람이 누구이고 누가 해당 부분을 수정했는지 확인하는 간단한 명령어를 알아봅니다.svn blame <파일이름>간단한 문법은 위와 같습니다. 해당 명령어를 사용하면 파일의 수정사항과 수정한 사용자를 보다 자세하게 행 단위로 확인할 경우 blame을 사용합니다.svn blame text.htmlblame이란 이름처럼 어떤 사용

  View : 1803 / 2014-01-24
• php [PHP] 데이터베이스(DB)에 데이터 전송시 특수문자 변환 및 띄어쓰기, BR태그 안녕하세요. 아래는 자동으로 문자를 변환해주는 함수입니다... PHP같은 서버 사이드 언어를 사용해 DB에 데이터를 추가 및 변경할 경우 특수문자를 자동으로 변경해 주는 명령어입니다.i. Backslash ii. Double Quote ”iii. Small Quote ’1. 먼저, 위 문자 앞에 자동으로 슬래쉬를 추가해주는 함수로 발생할 수 있는 오류를 덜어주는 편리한 함수 addslashes()입니다.* addslash

  View : 3672 / 2014-01-24
• php [PHP] 서버에 특정 파일이 있는지 확인, file_exists() 만약 php 서버에 어떤 특정한 파일의 존재하는지를 확인할 경우 아래와 같은 방법을 사용합니다.예를들면, 게시판을 통해 업데이트 한 경우입니다. 이런 경우 파일의 존재여부는 file_exists() 함수를 사용 할 수 있습니다.file_exists("경로 및 파일이름")

  View : 2323 / 2014-01-22
• html [HTML] 태그에 사용자 임의 속성의 입력 상황에 따라 태그에 사용자 임의의 속성을 넣고 싶을때가 있죠. class나 id값을 사용하기도 하지만 data가 많거나 복잡하면 다른 방법을 찾아야합니다.자주 사용되는 예는 게시판에 번호나 특정 style을 부여하려는 경우입니다. 사용자 속성의 경우 속성 이름을 짓는데 제한은 없지만 W3C의 권고사항으로 "data-" 형의 이름을 사용하면 좋죠.data-user="..." //user와 관련된 속성을 넣을 경우data-product="..." //produc

  View : 4834 / 2014-01-22
• js [자바스크립트] 텍스트에서 찾는 문자의 위치(순서) 불러오기, search() 문자열에서 특정 텍스트의 위치를 알고싶을때 search() 함수를 사용합니다. 해당 함수는 특정 문자열의 위치를 숫자로 반환하여 줍니다. 자세한 내용은 아래 예제를 참고하세요.# search() 예제소스 코드보기&

  View : 4121 / 2014-01-21
• js [JavaScript] 모바일 접속시 모바일 페이지로 변경 요즘 모바일 페이지는 필수라고 생각합니다. 모바일 접속자가 급성장하는 추세에 요즘 모바일 사용자가 워낙 많기 때문에 모바일 페이지를 개발 할 수밖에 없습니다. 만약 모바일로 접속한 사용자를 모바일 페이지에 이동시키려면 어떻게 할까요? 우선 navigator객체를 통해 userAgent 속성 사용하면 사용자의 접속환경을 확인할 수 있고 그 후 사용자의 접속환경 (디바이스 또는 브라우저)에

  View : 3291 / 2014-01-21
• webdevetc 웹표준이란? 웹표준은 반드시 필요한 것일까... 웹표준이 어려운 이유는? 우선, 웹표준이란 무엇일까요? 먼저 Wikipedia의 글을 인용하면...! 웹표준이란?1. 웹 표준은 월드 와이드 웹의 측면을 서술하고 정의하는 공식 표준이나 다른 기술 규격을 가리키는 일반적인 용어이다. 최근에 이 용어는 웹 사이트를 작성하는 데 중요도가 높아지고 있으며 웹 디자인, 개발과 관계가 있다.2. 수많은 상호 의존성이 있는 표준들과 규격들 가운데 일부는 단지 월드 와이드 웹으로만 끝나는 것이 아니라, 인터넷의 관리 측면이기도

  View : 885 / 2014-01-21
• html [HTML] textarea 태그의 특징 및 기본 속성 알아보기 textarea 태그는 홈페이지를 만들때 많이 사용되는 태그 중 하나입니다. 사용자의 입력을 받아 처리할 수 있는 입력폼으로 일반적인 레이아웃에 관련 속성외에 이벽값에 대한 추가적인 속성을 가지고 있습니다.입력폼의 경우 자주 사용되는 태그는 보통 짧은 글이나 문장에 input 태그가 사용되고 긴 글 또는 띄어씌기를 보여줘야하는 경우는 대부분 textarea 태그가 사용됩니다.아래는 textar

  View : 10931 / 2014-01-21
• js [자바스크립트] 날짜 데이터에 불러오기(년, 일, 월), Date객체 자바스크립트를 사용하여 날짜 데이터에 접근하기 위하여는 Date 객체를 통해서 접근이 가능하다. Date 객체는 날짜 및 시간에 관련된 정보를 가지고 있다.날짜 정보를 사용할 경우 일반적으로 Date 객체를 사용하여 새로운 인스턴스를 아래와 같이 생성하여 사용한다. 간단한 사용방법은 아래와 같다. 만약 현재 날짜를 date_value 변수에 저장한다고 한다면 다음과 같이 사용할 수 있

  View : 7057 / 2014-01-20
• html [HTML] Meta viewport 제어, 뷰포트 변경, 모바일 환경 meta 태그중 viewport 속성은 특히 모바일 웹페이지가 있는 경우 사용됩니다. 뷰포트는 사용하는 디바이스에서 웹페이지를 열었을 때 보여줄 화면의 크기와 부가적인 옵션을 제어할 수 있도록 도와줍니다~ 아래 예를 보시면...<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"><br

  View : 4339 / 2014-01-17
• css [CSS] 미디어 쿼리, 외부 또는 내부 코드로 사용하는 방법 CSS media query의 스타일을 지정하는 방법입니다. 다만 다양한 방법으로 지정할 수 있습니다. 아래를 바주세요.CSS에 미디어쿼리(mediaquery)를 적용하는 방법은 크게 두 가지가 있습니다. <link media="..."> 처럼 직접 screen 속성을 지정하여 외부 파일을 import하는 방법이 있구요 @screen을 사용해 style 내부에 추가해 사용하는 방법이 있습니다.- <link>태그를 사용하여 설정하는 방법- style 태그 내부에

  View : 4022 / 2014-01-14
• css [CSS] 속성 선택자를 사용해 특정 속성을 가진 요소에 스타일 부여방법 CSS의 선택자 지정 방법을 알아봅니다. 여기서는 엘리먼트의 속성을 선택하는 경우 사용 가능한 선택자 방법입니다.# CSS 속성을 선택자로 지정하는 방법DOM 엘리먼트, 태그 요소는 여러가지 어트리뷰트, 속성을 가지고 있습니다. 이 값을 가지고 CSS에서 선택하는 방법으로 속성 선택자를 사용하는 방법입니다 키워드는 []를 사용하고 이를 사용하여 해당하는 속성을 가진 요소에만 스타일 지정을 할 수가 있죠. 그럼 아래를 봐주세요.<b

  View : 5525 / 2014-01-14
• css [CSS] CSS 적용방법 중 외부 CSS를 불러오는 방법 웹페이지를 만들때 CSS 불러와 적용하는 방법을 알아봅니다. 어떻게 하면 CSS를 적용할 수 있을까요?# CSS 적용하는 방법, import일반적으로 css는 html 등의 템플릿 파일에서 사용하거나 아니면 외부에서 있는 파일을 불러와서 사용하는 두 가지 형태로 사용됩니다. 먼저 파일 내부에서 사용되는 경우는 다음과 같겠죠.파일 내부에서 css style

  View : 6299 / 2014-01-14
• css [CSS] 테두리 및 요소에 그림자 효과 부여하기, box-shadow CSS를 사용하여 엘리먼트 요소에 그림자 효과를 부여하는 방법을 알아봅니다. 어떻게하면 그림자(shadow)를 만들 수 있을까요? 그리고 언제 사용할까요?! 그림자 효과 사용하는 경우엘리먼트에 그림자 효과를 사용하는 경우는 웹페이지를 만들때 특히 아래의 경우에 많이 사용됩니다.<b

  View : 38208 / 2014-01-14
  
• css [CSS] 대,소문자 변경하기, text-transform 웹페이지에서 텍스트를 출력해 화면에 보여줄 때 대문자 또는 소문자로 변경한 뒤 보여줄 경우가 존재합니다. 때로는 텍스트의 모든 앞글자만 대문자로 변경하거나 아니면 전부 소문자나 대문자로 변경이 필요하죠.! 편리한 CSS 대소문자 변경하기이런 경우 서버에서 변환하거나 아니면 

  View : 7414 / 2014-01-12
  
• js [자바스크립트] 백그라운드(background) 경로, 주소 불러오기, getComputedStyle() 이미지 태그를 사용하지 않고 백그라운드를 사용한 이미지의 경우 이미지 경로를 확인하려면 아래의 함수를 사용해 불러올 수가 있습니다. 그 외에도 다른 속성들 예를 들어 display나 margin등의 속성이 가진 값을 확인할 때도 아래 함수를 사용해 어떤 값이 지정되었는지 알 수 있습니다.<img src="/static/uploads/2017/1782_js

  View : 10208 / 2014-01-12
  
• css [CSS] transform 속성을 이용하여 회전, 이동, 크기, 기울기 등 효과 주기 CSS를 사용하여 다양한 시각적 효과, 애니메이션을 구현할 수 있는 transform 속성에 대하여 알아보려합니다.# CSS transform 알아보기먼저 trans

  View : 74517 / 2014-01-12
  
• css [CSS] font-smoothing 속성 사용방법, 폰트 부드럽게 만들기 웹페이지의 폰트를 부드럽게 사용하기 위해서 css의 font-smoothing 속성을 사용할 수 있습니다. 아래는 이를 적용하는 방법과 효과에 대하여 알아봅니다.# CSS의 -webkit-font-smoothing 속성 알아보기CSS의 스타일 속성 중 하나로 -webkit-font-smoothing 속성이 있습니다. 이 속성을 적용하면 브라우저에 표현되는 텍스트가 렌더링

  View : 21524 / 2014-01-12
• css [CSS] display와 visibility 속성을 사용해 특정 요소 사라지게 만드는 방법 및 팁 CSS를 사용해 특정 콘텐츠 및 요소를 사라지게 만들어야 할 경우가 있습니다. 이때 사용가능한 속성이 바로 display와 visibility입니다. 이 둘 속성은 매우 자주쓰이는데요... 사라지게 한다는 점에서는 같으나 둘의 차이점은 무엇일까요? <span data

  View : 13522 / 2014-01-12
  
• js [JavaScript] Select 태그의 값을 순서, Index로 찾기, selectedIndex select 태그에서 선택된 값이 있는 경우 몇번째 해당하는지 값을 알려면 어떻게 알 수 있을까요? 아래 방법은 선택된 값을 얻는 자바스크립트 방법입니다.# selectedIndex를 사용한 select 태그의 선택값 알아내기<b

  View : 32692 / 2014-01-12
  
• html [CSS] media query에서 screen과 only screen의 차이점 CSS의 미디어 쿼리 @media를 작성하는 경우 웹페이지에서 두가지 코드 타입을 볼 수 있습니다. 바로 @media screen 그리고 @media only screen입니다. 과연 이 둘의 차이점은 무엇이고 왜 다르게 사용하는 걸까요? 그 이유에 대하여 알아보고자 합니다.# Example 1@media screen (min-width: 1024px) {   color: #000

  View : 7189 / 2014-01-11
• js [Ajax] 전달받은 responseText의 데이터를 객체로 변환 및 출력하기 Ajax등의 비동기 통신으로 받은 데이터가 문자열이나 객체 구조를 띄는 경우가 있습니다. 실제로 데이터베이스 또는 로컬에 저장할때 문자열로 변환 후 저장하기도 하는데 이런 경우 다시 객체 구조로 변환해야 사용할 수 있죠. 이 방법으로 JSON.parse()를 사용합니다.<h4 data-custom-style="

  View : 14138 / 2014-01-10
• js [Ajax] 비동기식 처리, XMLHttpRequest 자바스크립트를 사용하여 비동기 방식(ajax)으로 처리하는 웹사이트가 많이 늘어나고 있습니다. 그 이유는 역시 비동기식 방식(asynchronous way)이 가진 많은 장점 때문인데요...아래는 자바스크립트를 사용하여 비동기 방식의 네트워크(ajax)를 구현하는 방법에 대하여 자세히 알아보고자합니다. 그럼 우선적으로

  View : 8641 / 2014-01-09
  
• js [JQuery] Input, Textarea 활성화 또는 비활성화 변경 제이쿼리를 사용하여 input 태그 그리고 textarea 태그를 활성화 또는 비활성화로 변경하는 방법을 알아봅니다. 입력폼인 위 태그를 활성화 또는 비활성화 할 경우 글 입력(작성)이 가능 또는 불가능하게 변경할 수 있습니다. 그렇다면 아래는 이를 바꾸는 방법입니다. $(ele).attr('disabled', 'disabled');# 제이쿼리 a

  View : 17871 / 2014-01-09
• js [자바스크립트] replace() 문자 변환, 치환 자바스크립트를 사용해 특정 문자를 다른 문자로 치환하는 방법에 대하여 알아볼까합니다. 먼저 사용할 메소드는 replace() 입니다. 사용방법은 아래와 같습니다. str_text.replace("찾을 문자열", "변경할 문자열") 자바스크립트의 replace()함수

  View : 227504 / 2014-01-09