Loading...

CSS로 말줄임 효과내기

스크립트를 사용하지 않더라도 브라우저에서는 말 줄임을 css로 가능하게 지원해준다.아래는 지원여부에 따라 테스트해본 결과이다. test text. test text. test text. test text. test text. test text. test text. .selector { width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } css의 네가지 규칙만 넣어주면, IE6~10, safari, firefox, chrome 모두 잘 나왔다. (만약 부모노드에서 width값과 overflow: hidden이 걸려있으면 텍스트를 담은 태그에서는 생략해도 관계없다.) 그러면 2줄 이상일때 말줄임도 가능할까? html은..

2013.05.13 16:13

IE10에서 네이버 스마트 에디터 자바스크립트 오류

예전에 인터넷 익스플로러 9 (IE 9)에서 네이버 스마트 에디터 오류로 인하여 에디터 편집창이 활성화되지 않는 버그가 있어 코드를 아래와 같이 수정하였다. Husky.SE_Basic.js 의 283번째 줄 부근?? 아마.. 이 근처인듯하다. if(this.bIE){button=document.createElement("");} 의 코드를 IE9 에 맞게 아래줄로 바꿔 줌. if(this.bIE&&navigator.appVersion.indexOf("MSIE 9")){button=document.createElement("");}else{button=document.createElement("BUTTON");button.type="button";} 이렇게 수정하였다. IE8 이하버전과 IE9 이후 버전의..

자동 개행

word-wrap: break-word; /* Internet Explorer 5.5+ */ white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-break:break-all; FF억지춘향 줄바꿈 / Dev html에서 한 문장의 줄이 길어지면 보통은 자동으로 줄바꿈해주지 않는다. IE(5.5부터인가?)의 경우는 css에 "word-wrap:break-word;"를 써주면 조금 어색한 곳이라도 무조건 줄바꿈시켜준다. 문제는 Firefox!! 여차저차 ..

CSS Hack

브라우저의 버그를 hack으로 해결할 수 있는 부분이 많이 있습니다만 그보다 사이트의 CSS구 조를 설계할때 각 브라우저의 속성을 파악해고 조금만 더 주의해서 설계를 하시면 hack을 사용하지 않고도 해결할 수 있는 부분이 많이 있습니다. hack을 사용할때는 조금 더 신중하게 사용하시는게 좋습니다. 특히 예전 버전의 브라우저에 적용되었던 hack이 새로운 브라우저에 영향을 끼칠 가능성이 있으며 CSS를 변경 할 때 업무효율을 저하시키는 한 요인이 될 것 입니다. Intenet Explorer계열의 브라우저에서 제대로 표시가 되지 않는 경우에는 일단 width값이나 float관련 설정을 변경해 보시는 것도 하나의 방법인 것 같습니다. 혹시 Intenet Explorer에서 float와 margin을 같은..

디자인 템플릿

소개 :무료로 사용이 가능한 사이트 디자인 템플릿을 공유해 주는 해외 사이트입니다국내의 그래픽 칠갑이나 빼곡한 리스트의 경향과 대조적으로 한가로운 분위기네요? http://www.opensourcetemplates.org/http://www.templateworld.com/free_templates.htmlhttp://www.oswd.org/http://www.free-css-templates.com/free-templates.htmlhttp://www.templatesbox.com/http://www.freelayouts.com/websiteshttp://www.ex-designz.net/template/tempcat.asp?cat_id=13http://www.openwebdesign.org/brows..

[HTML] CSS3 를 이용한 툴팁(Tooltip) 표시

스크랩 http://phpschool.com/link/tipntech/74887 링크나 제목 외국사이트 돌아다니다 이런식으로 가능한줄 처음 알았네요 ㅜ.ㅜ 맨날 Javascript나 레이어 처리만 했었는데 -0- 여러곳에 사용할때 편할것 같습니다. IE9, Chrome16 , FF9 등에서 확인 하였습니다. 난 너무 최신버전만 좋아해 ㅜ.ㅜ index.html .

와우.....open-flash-chart 이거 와방 좋네요.

회사에 내부 인트라넷에 통계용 그래프를 이전에는 VML 을 이용해서 작성했었는데 VML 이건 완전 캐노가다. ㅠㅠ. VML 로직 짜는데 머리 다 빠지는줄. 그런데도 영 볼품은 없고. 그러다가 open-flash-chart 라는걸 알게됨...... 이야 와방 굳임.! 굳!굳!굳! [ 새 창으로 보기 ] .

이미지 툴바 감추기

익스플로러버전6 부터 지원되는 이미지툴바를 제어하는 방법입니다. MSDN에 있는 내용을 간략히 정리해봤읍니다. 관련문서: [ http://msdn.microsoft.com/library/default.asp?url=/workshop/misc/mypictures/mypictures_ovw.asp ] 모든 이미지의툴바 숨김 [CODE] [/CODE] 특정 이미지의툴바 보여줌 [CODE] [/CODE] 특정 이미지의툴바 감춤 헤데에 http-equiv="imagetoolbar" content="no" 를 선언하지 않고 특정 이미지만 툴바가 나타나지 않도록 설정할 수 있읍니다. [CODE] [/CODE] 출처 : PHPSCHOOL 에서 우정원님의 글.

이메일 네임택 만들어주는 사이트

블로그 방문도중 네임택 만들어주는 사이트가 링크되어있어서 방문해봤다. 신기하다 ^_^* 이런거 첨 봐서 ㅎㅎ 나두 하나 만들어봤당. 어떤가 ㅎㅎㅎ 아래로 방문하면 만들어준다 http://cat.powerdb.net/email/custom.php >>ㅑ 아래 세개는 마루호스팅 커뮤니티에서 만든건데... 귀엽다 ^_^;.

한국의 전통색

무채색계(無彩色界) 흑백1D1E2393,89,83,52 백색FFFFFF0,0,0,0 회색A4AAA738,27,31,0 구색959EA245,32,32,0 치색61626472,64,62,4 연지회색6F606E55,58,40,20 설백색DDE7E712,4,7,0 유배색E7E6D29,5,18,0 지배색E3DDCB6,6,17,4 소색D8C8B210,15,26,5 적색계(赤色界) 적색B8264721,98,68,8 홍색F15B5B0,80,60,0 적토색9F494C29,80,64,17 휴색68323540,80,66,44 갈색96614731,61,73,21 호박색BD7F4121,51,84,8 추향색C3886619,48,61,6 육색D7796411,62,59,2 주색CA5E5915,75,62,4 주홍색C2335218,94..