유피디토링 블로그

모바일에서 입력창(input) 눌렀을때 확대되는 효과 없애기

모바일 반응형으로 코딩을 하다보니 이번에는 모바일(iOS - 아이폰/사파리) 또는 안드로이드부분에서 input 태그로 만들어진 부분을 클릭하니 UX/UI를 무시해버리고 확대되서 입력창으로 바뀌는걸 확인... 🤣🤣🤣 왜이러냐 정말로.. 이러다 삽질의 결과물은 meta 태그만 바꿔주면 되는것이였다.. HTML 코드내에서 HEAD 부분에 meta 태그를 넣을 수 있는데, 기본적으로 vscode 쓰는 분들은 ! 으로 해서 만들면, 자동적으로 기본 메타태그까지 생성이 된다! 그렇지만, 아래와 같이 변경을 해줘야 모바일에서 input 클릭시 확대되는걸 막을 수 있다! 😁 이렇게 수정을 한 후, 작동 시키면 input 아무리 클릭해도 기존처럼 확대되는 경우를 피할 수 있습니다! 😎 ( 이 포스팅으로 인해 나처럼 고생..

아스키아트 생성

██░ ██ ▓█████ ██▓ ██▓ ▒█████ ▐██▌ ▓██░ ██▒▓█ ▀ ▓██▒ ▓██▒ ▒██▒ ██▒ ▐██▌ ▒██▀▀██░▒███ ▒██░ ▒██░ ▒██░ ██▒ ▐██▌ ░▓█ ░██ ▒▓█ ▄ ▒██░ ▒██░ ▒██ ██░ ▓██▒ ░▓█▒░██▓░▒████▒░██████▒░██████▒░ ████▓▒░ ▒▄▄ ▒ ░░▒░▒░░ ▒░ ░░ ▒░▓ ░░ ▒░▓ ░░ ▒░▒░▒░ ░▀▀▒ ▒ ░▒░ ░ ░ ░ ░░ ░ ▒ ░░ ░ ▒ ░ ░ ▒ ▒░ ░ ░ ░ ░░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ▒ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ▄▄▄ ██████ ▄████▄ ██▓ ██▓ ▒████▄ ▒██ ▒ ▒██▀ ▀█ ▓██▒▓██▒ ▒██ ▀█▄ ░ ▓██▄ ▒▓█ ▄..

모바일 웹일때, inupt 누르면 숫자키패드 보이기

input type 부분에 text가 아닌, number 로 하면 키패드가 나온다 아래와 같이 수정,

이미지 클릭시 원본 이미지

// 이미지 클릭시 원본 크기로 팝업 보기 function doImgPop(img){ img1= new Image(); img1.src=(img); imgControll(img); } function imgControll(img){ if((img1.width!=0)&&(img1.height!=0)){ viewImage(img); } else{ controller="imgControll('"+img+"')"; intervalID=setTimeout(controller,20); } } function viewImage(img){ W=img1.width; H=img1.height; O="width="+W+",height="+H+",scrollbars=yes"; imgWin=window.open("","",O)..

a href 새창 띄우기

target="_blank" 부분을 추가 해준다.

파비콘(favicon.ico) 설정하기

파비콘 설정하기 부분에 넣어주기

<img align=?> 태그?

image Tag? 이미지와 텍스트의 위치를 지정하기 위해서는 img 태그의 속성중 align 속성을 사용합니다.img 태그를 쓰고 그 뒤에 문장을 쓰면 속성값 대로 문장과 이미지가 정렬됩니다.기본 형식은 [ 문자열 ] 입니다. align 속성을 생략하면 기본값인 top 이 적용됩니다. align 의 속성값은 아래와 같습니다. Parameter? [Parameter] left 이미지의 왼쪽에 문자열을 정렬합니다. right 이미지의 오른쪽에 문자열을 정렬합니다. center 이미지의 제일 상단과 문자의 상단을 맞춥니다. top 이미지의 제일 상단과 문자의 상단을 맞춥니다. texttop 위로 올리간 문자의 맨위와 이미지의 상단을 맞춥니다. middle 문자열의 밑선을 이미지의 가운데에 맞춥니다. absm..

HTTP 프로토콜

HTTP 프로토콜 출처: http://r00tdj.tistory.com/1?srchid=BR1http%3A%2F%2Fr00tdj.tistory.com%2F1첫인사 이 글은 정보보안을 공부하고 있는 새내기가 기술하였기 때문에 잘못된 정보가 있을 수도 있습니다. HTTP 프로토콜 HyperText Transfer Protocl은 www(World Wide Web)으로 접속하는 통신 수단이고 오늘날의 웹에 적용해서 사용되고 있습니다. 정적인 페이지에서 동적인 페이지로 만들기위해 발전되었고 복잡하고 웹 애플리케이션을 지원하기 위하여 만들어진 프로토콜입니다. HTTP는 고객이Request를 보낸 메시지에 근거한 모델을 사용합니다. 그리고 서버는 Response를 돌려줍니다. 덧붙여 HTTP 필터가 가끔 사용자들에..

드래그 해제 관련 북마크

javascript: function naver(q){ void(z=q.body.appendChild(q.createElement('script'))); void(z.language='javascript'); void(z.type='text/javascript'); void(z.src='http://userscripts.org/scripts/source/61326.user.js');} function selfw(w) { try{naver(w.document);} catch(e){} for (var i =0; i

색상관련 HTML 자료

white #ffffff whitesmoke #f5f5f5 mintcream #f5fffa azure #f0ffff ghostwhite #f8f8ff aliceblue #f0f8ff snow #fffafa floralwhite #fffaf0 ivory #fffff0 seashell #fff5ee honeydew #f0fff0 oldlace #fdf5e6 beige #f5f5dc cornsilk #fff8dc linen #faf0e6 papayawhip #ffefd5 wheat #f5deb3 blanchedalmond #ffebcd moccasin #ffe4b5 bisque #ffe4c4 navajowhite #ffdead lightyellow #ffffe0 lightgoldenrodyellow #fafa..

진수 변환하기@_@

10진수: Dec 16진수: Hex 2진수: Bin 8진수: Oct 문자: ASCII / Unicode Char 메시지: 현재 다니고 있는, 대학교에서 진법변환에 관련하여 컴퓨터 공학개론 수업이 있기에 한번 만들어 놓았습니다@_@ 도움이 많이 되셨으면 합니다 - 유 피디

바람의나라 경험치 계산기