/** * Blower :: IE11, Chrome * Desc :: Character spacing (letter-spacing, word-spacing) */ 글자, 단어 간격 조정 :: letter-spacing, word-spacing TEXT TEXT TEXT TEXT ResultTEXT TEXTTEXT TEXT /** * 궁금한 점은 댓글로 남겨주세요. * Please fell free to ask me any questions. */
/** * Browser :: IE9+, Chrome, Safari, Firefox, Opera * Desc :: text ellipsis 처리 **/ 텍스트의 경우 white-space: nowrap;text-overflow: ellipsis;overflow: hidden; 테이블의 경우 텍스트가 길어지면 세가지 현상이 나타나는데, 1. 테이블 길이가 텍스트 길이에 맞춰진다.2. 텍스트가 줄바꿈 되면서 테이블의 세로 길이가 늘어난다.3. 텍스트가 테이블 크기를 뚫고 나간다. 에는 "table-layout: fixed", 에는 "white-space:nowrap; text-overflow:ellipsis; overflow:hidden;" HTML 번호 제목 작성자 등록일 조회수 1111111111 제목입..
/** * Browser :: IE9+, Chrome, Safari, Firefox, Opera * Desc :: mobile call, onclick / a href */ HTML 02-1234-1234로 전화걸기 Result 버튼에서는 onclick 이벤트로 전화번호 값을 아래와 같이 줄 수 있으며, 태그를 통해서도 아래와 같이 가능합니다. 모바일에서 버튼 클릭 시 팝업창으로 전화번호와 함께 'Cancel' / 'Call' 버튼이 나타나게됩니다. /** * 궁금한 점은 댓글로 남겨주세요. * Please fell free to ask me any questions. */
/** * Browser :: IE9+, Chrome, Safari, Firefox, Opera * Desc :: 테이블 내 텍스트 자동 줄바꿈 */ CSS pre { white-space: pre-wrap; /* CSS3*/ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-all; /* Internet Explorer 5.5+ */ } Result 이러할 때 Pre tag를 자동개행 시켜주면, 테이블 크기에 맞게 개행이 들어가게되며, 정상적으로 출력됩니다. /** * 궁금한 점은 댓글..