웹솔루션개발 25년 노하우! 해피CGI의 모든것

border-image 속성으로 간편하게 테두리 효과를 줄수 있는 CSS border-image 속성으로 간편하게 테두리 효과를 줄수 있는 CSS생성기입니다. 원하는 배경이미지를 업로드 하고 원하는 위치대로 마음대로 지정해서 생성하면 됩니다. 다양하게 이용이 가능하며, 브라우져별 주의 사항에 따라서 이용하시면 좋습니다. 고해상도 이미지를 쓰실려면 이미지 영역값만 두배로 설정해서 하시면 됩니다. border-image의 Offset값이 10으로 세팅있으면, border-width는 그대로 두고 Offset값만 20으로 설정하면 됩니다.

스크립트와 css를 이용한 반응형 탭 소스입니다. 브라우저의 가로 크기에 따라 탭의 디자인이 변경됩니다. 가장 큰 사이즈는 아이콘과 텍스트 동시에 출력됩니다. 중간 사이즈는 아이콘만 출력됩니다. 가장 작은 사이즈는 아이콘만 출력되고 탭사이트 간격이 없어집니다. 탭의 가로사이즈는 자동으로 조절이 됩니다. 해당 웹사이트에서 소스를 다운로드 받으실 수 있습니다.

구글에서 정말 간단히 웹사이트에 번역기를 달수 있도록 제공하고 있습니다. 영문과같은 부분은 오류가 있을 수 있지만. 어순이 같은 일본어와같은 곳은 괜찮을듯 합니다 ^^ 위 주소로 접속을 하시게되면 아래와같은 이미지를 확인하실 수 있습니다. 웹사이트에 지금 추가 버튼을 누르시면 웹사이트 정보 페이지로 이동을 하며 적용할 사이트의 url 그리고 웹사이트 언어를 설정할 수 있으며 설정 후 다음 버튼을 누릅니다. 번역할 언어를 모든언어, 특정언어를 골라서 선택할 수 있으며. 표시될 검색버튼을 다양한 형태로 변경도 가능합니다. 코드받기를 누르시면 코드를 받으실 수 있으며 위 코드를 사용하실 페이지에 원하는 위치에 넣어주시면 됩니다. 유용하게 사용하실 바랍니다 ^^

이런 말풍선 이쁘나요? 저는 갠찮은거 같아 소개 드립니다. 위치도 , 색깔도, 크기도, 액션도 갠찮은것 같습니다. 사용하시려면 우선 다운로드 받으시면.... hint.css 과 hint.min.css 파일이 있습니다. 추측 하셨겠지만 hint.min.css 는 저용량 구동전용파일입니다. 직접 소스를 수정하고 싶으시다면 hint.css를 사용하시면 되겠죠? 사용하시고자 하는 페이지 상단에 요렇게 넣으시고 사용하시면 됩니다. 해볼까요? 코드 테스트 사이트에서 해보았습니다. 이렇게 하니깐 바로 이렇게 나오네요~! 제서버에 서 다시 해볼까요? 코드 테스트 사이트랑 똑같이 나오네욤,,, 요러한 옵션들이 있으니깐 테스트 해 보세요~! Colors - hint--error, hint--info, hint--warni..

웹접근성 적용을 위한 네이버 웹 접근성 체험 사이트 회사에 웹접근성 확인을 위한 스크린 리더기 기타 관련 용품이 없을경우 웹접근성 작업을 위해 미리 체험해 볼 수 있는 네이버 체험 사이트 입니다. 웹접근성 규정에 맞춘 작업을 위해서 미리 체험 할 수 있어서 유용하네요. 체험에는 저시력 시각장애, 전맹 시각장애, 손운동장애, 증중 운동장애 관련 웹접근성 체험이 가능합니다. 체험해보니 웹접근성 작업에 많은 도움이 되고, 웹 사이트 제작외에 다양한 경험을 한거 같아서 좋습니다.

셀렉트박스 디자인을 쉽게 할수 있는 디자인셀렉트박스 생성기입니다. 관련 HTML, css, 자바스크립트 웹브라우저에서 바로 작성하고 확인 및 소스 복사도 가능합니다. 여러가지 디자인의 셀렉트박스를 손쉽게 만들고 이용가능해서 좋네요. 라운드형, 직각박스형, 화살표 아이콘도 변경이 가능하니. 다양하게 이용이 가능하겠네요.

처음 들어갔을때는 자료를 보고 너무 적은거 아니야? 라는 생각이 드는데요. html 작업시 기초가 되는 부분을 자세히 설명해준 홈페이지라서 초보자분들도 쉽게 공부할수 있는 유용한 사이트입니다^^ 예제 및 설명이 보시는 이미지처럼 잘되어 있어, 누구나 손쉽게 접근하고 사용이 가능하실것입니다. 모두 열공하시길 바랍니다*_*

HTML5로 들어오면서 새롭게 생겨난 속성입니다. 기존에 인풋박스에 placeholder와 같은 속성을 이용하려면 자바스립트나, jquery를 이용하여 이미지 또는 텍스를 이용하여 복잡하게 설정해야만 했지만. placeholder는 간단히 태그입력후 alt나 title속성입력하는것과 같이 원하는 문구를 적어주면 됩니다. 위와같이 사용할수도 있으며 인풋태그에 간단히 설명을 입력할 수 도 있습니다. 사용방법은 예시 html5로 업그레이드되면서 새롭게 생긴속성이라서 구버전 익스플로러에서는 사용이 되지 않습니다. ie의 같은경우는 10버전에서 일부의 html5를 지원하기때문에 9이하로는 무용지물이 됩니다. 아래의 링크를 통해서 개발자가 만들어둔 jquery소스를 이용해 placeholder를 ie9이하에도 사용..

하나의 화면에서 반투명한 레이아웃을 CSS로 구현할 수 있습니다. [제작화면] HTML과 CSS, JS를 하나의 화면에서 확인할수있습니다.

다양한 형태의 마우스 오버 효과입니다. 이미지. 타이틀, 서브타이틀 같은 정보가 나오는 곳에 효과적으로 사용이 가능합니다. 해당 사이트에서 소스를 다운로드 받으실수 있습니다. html과 css에 대한 자세한 설명이 있습니다.