개발자의 끄적끄적

[html/css] html span tag width example / html span 태그 너비값 지정하는 방법 html 에서 span 태그를 사용하여 영역을 만들때 내용이 길던 짧던 너비값을 지정해서 동일하게 사용하고 싶은 경우가 있습니다! width:100px 로 하면 100px 너비가 유지될거 같지만, 그렇지 않습니다! 그럴때는 아래와 같이 하시면 됩니다! abcde 위 내용을 보시면 아시겠지만, style 에 inline-block 속성을 추가하면 정상적으로 반영됩니다! span 태그의 높이나 너비값을 지정하기 위해서는 block 요소로 만들어야 된다는점! 참고들 하세요!

[html/css] html a 태그 클릭시 메일앱이나 전화앱으로 이동시키는 방법 html 에서 a태그를 클릭하면 메일앱으로 넘어가거나 전화거는 화면으로 넘어가게 처리하고 싶은 경우가 있습니다! 그럴때는 아래와 같이 href 에 값을 넣어주시면 됩니다! 1. 메일 앱으로 이동 2. 전화 앱으로 이동 참고들 하세요!

[html/css] html input size example / html input 입력 사이즈 설정 방법 html input 에서 특정 글자수만 입력을 받도록 제어를 하고 싶은 경우가 있습니다. 그럴때는 input 태그에 size 를 설정하면 됩니다. size 예를들어 input 태그에 4글자만 입력을 받고 싶다면 아래와 같이 설정하시면 됩니다! 참고들 하세요!

[html/css] html input readonly example / html input 읽기전용 설정 방법 html 에서 input 박스가 수정이 안되고 읽기 전용으로 설정하고 싶을때 readonly 를 사용합니다. readonly input 에 readonly 를 적용하면 아래와 같습니다! 사용법도 간단하고 사용하는 경우가 많으니! 꼭 참고들 하세요!

[html/css] html disabled example / html 태그 비활성화 방법 html 에서 특정 태그를 사용불가 즉, 폼컨트롤이 불가능 하도록 설정해야 하는 경우 아래와 같이 disabled attribute 를 이용합니다. disabled="disabled" 예를들어 text 타입의 input 이 있다고 가정하고 해당 input 을 비활성화 하고 싶을때는 아래와 같이 disabled 를 추가하시면 됩니다! 참고들 하세요!

[html/css] 이미지 드래그 잔상방지 방법 / 드래그 고스트 이미지 방지 방법 홈페이지에서 이미지영역을 클릭후 드래그하면 고스트이미지라고 하는 잔상이 마우스를 따라 움직이는것을 확인할 수 있습니다. 그걸 방지하기위해서는 css 옵션을 추가하면 됩니다. 우선 아래와 같은 img 태그가 있다고 가정하고 위 이미지를 드래그 잔상 방지를 하기위해서 아래와 같은 style 옵션을 줍니다. 그리고 테스트 해보면 잔상이 안뜨는것을 확인할 수 있습니다. 브라우저나 환경에 따라 다른경우가 있다고 하는 분들도 계시는데요! 저는 일단 크롬버전에서는 정상동작하는것으로 확인했습니다! 참고들 하세요!

[html/css] html input box 테두리 없애는 방법 html 에서 input box 의 테두리를 없애고 싶은 경우가 있습니다. 그럴때는 input 태그에 아래 style 옵션을 추가해주면 됩니다. style="border:0 solid black" 위 옵션을 추가한 예제는 아래와 같습니다. 참고들 하세요!

[html/css] html meta redirect example / html 페이지 리다이렉트 방법 html 에서 특정페이지나 html 파일 접근시 다른페이지로 redirect 시켜야 하는 경우가 있습니다. 그럴때는 아래처럼 meta 태그를 이용하면 됩니다! 위 내용처럼 전환하고자 하는 페이지 상단에 meta 태그를 사용하시고 url 에 원하는 redirect url 을 입력하시면 됩니다! 참고들 하세요!