한글,영문입력방법 적용하는 스타일

게시글

한글입력 불가능하게 하기

아이디입력처럼 한글을 입력하면 안되는경우에 사용하면 편리하다

게시글

영문,숫자,대문자로만 입력가능

입력할때 영문 숫자 대문자로만 입력가능함 style="ime-mode:disabled;text-transform:uppercase;"

게시글

input type=text 태그만 별도로 스타일 지정하는 방법

input{display:none;} 이렇게 css선언하게 되면 모든 input 태그는 비노출이된다 text,password,checkbox,radio등등 모두 비노출되는 식이다 그러나 input=text만 별도로 적용하고자 하는경우가 있는데 이때 사용하는 방법이다 input { expression(this.type == "text" ? "none" : font-size:13px) } expression를 통해서 this.type == "text"구분하여 별도록 스타일을 지정할수 있다

게시글

영문,숫자와 한글 문자 갯수 알아오는 방법

영문,숫자와 한글 텍스트는 바이트 수가 차이가 있다 strlen("1234");// 4노출 strlen("숫자");// 2노출이 되는것이 아닌 4가 노출된다 strlen("숫자");// 2로 노출하고 싶은경우가 있다 이때 사용하는 방법은 mb_strlen("숫자","utf-8") => 2노출 한글 숫자로 호출할수 있다 이때 캐릭터셋을 꼭입력해줘야 한다

게시글

비밀번호 입력문구 input 이지미 삽입

input type이 password인경우 value="비밀번호" 이렇게 입력하면 ****이렇게 내용을 볼수 없다그렇기때문에 해당 문구를 넣고 싶은경우 이미지를 활용하는 방법을 사용한다 input_pw.gif 이미지에 "비밀번호입력" 이런식으로 만들어지 이미지를 호출하는 형태이다 그리고 onfocus 되었을때 이미지를 비우는 식으로 문구를 제거한다

게시글

웹폰트를 사용해서 텍스트 폰트변경하기

웹폰트를 사용하는 방법이다 스타일부분에 @font-face{font-family: fontstyle01;src:url(/swww/font/RixGoB.eot);} 선언하고 사용하고자 하는곳에 다음과같이 사용하면적용된다 웹폰트 NanumGothic.eot 장점이 틀림없이 있다 그러나 난 별로 사용하지 안는다 이유는 IE에서는 작동되는데 크롬브라우저에서는 적용되지 않는다 그리고 적용되는 IE에서도 로딩과동시에 적용되는것이 아닌 페이지로딩후 조금 후에 글씨체가 변경된다 아무래도 해당 NanumGothic.eot 폰트를 불러오는 시간이 걸리는듯하다 그리고 기본적인 확장자는 ttf인데 이걸 eot파일로 변경한 후에 사용해야된다

게시글

웹폰트를 사용한 텍스트 폰트변경하는 방법

@font-face{font-family:fontstyle01;src:url(NanumGothic.eot);} @font-face{font-family:fontstyle02;src:url(NanumGothicBold.eot);} @font-face{font-family:fontstyle03;src:url(NanumGothicExtraBold.eot);} 웹폰트 NanumGothic.eot 웹폰트 NanumGothicBold.eot 웹폰트 NanumGothicExtraBold.eot 웹폰트를 사용하는 방법이다 스타일부분에 @font-face{font-family: fontstyle01;src:url(/swww/font/RixGoB.eot);} 선언하고 사용하고자 하는곳에 다음과같이 사용하면적용된다 웹폰트 NanumGothic.eot 장점이 틀림없이 있다 그러나 난 별로 사용하지 안는다 이유는 IE에서는 작동되는데 크롬브라우저에서는 적용되지 않는다 그리고 적용되는 IE에서도 로딩과동시에 적용되는것이 아닌 페이지로딩후 조금 후에 글씨체가 변경된다 아무래도 해당 NanumGothic.eot 폰트를 불러오는 시간이 걸리는듯하다 그리고 기본적인 확장자는 ttf인데 이걸 eot파일로 변경한 후에 사용해야된다

게시글

text 내에 안내문구 넣는 placeholder 태그

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: red; opacity: 1; /* Firefox */ } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: red; } ::-ms-input-placeholder { /* Microsoft Edge */ color: red; }