본문 바로가기

분류 전체보기245

css 글자수 ...처리 ellipsis 기능 html 체부동 수제비와 보리밥 서울특별시종로구 동안시 어쩌구 저쩌구 0 5 css width:70px; padding:0 5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; 결과화면 2020. 12. 30.
typescript 배열길이 구하기 array= [ 1, 2, 3, 4 ]; array.length; 결과화면 3 2020. 12. 29.
이미지 화질 유지하면서 상단 하단 자르고 가운데로 정렬하기 HTML 소스 설명 1. html 생성 2. 에 max-height: 80px;overflow: hidden; 속성 부여 3. 에 max-height: initial;margin-top: -20%; 부여 4. max-height와 margin-top 값 수정하면서 조절 결과 화면 2020. 12. 29.
ionic card 카드 디자인 퍼블리싱 예제 css 홀수 짝수 적용 다음과 같이 처리를 해준다. 1. content 백그라운드 회색배경 2. 공용 div scss 처리 3. 홀수 div 처리 짝수 div 처리 html dd ss css ion-content{ --ion-background-color:#f3f3f3; } .card_div{ float:left; width: calc(50% - 21px); background: white; height: 180px; } .card_div:nth-child(even) { margin-right: 14px;margin-left: 7px; } .card_div:nth-child(odd) { margin-left:14px;margin-right:7px; } 결과 화면 2020. 12. 29.
ionic ion-content background-color 예제 example scss ion-content{ --ion-background-color:#f3f3f3; } 2020. 12. 29.
aws ip 접속 권한 추가 EC2 SSH aws 접속 ec2 서비스 접속 보안그룹 클릭 보안 그룹 생성 네이버 내 아이피 확인 인바운드 규칙 편집 예시) SSH / TCP / 22 / 사용자 지정 / 000.000.00/32(네이버에서 검색한 내 아이피) / 비고란 추가 규칙저장 2020. 12. 29.
초보도 따라할 티스토리 소스코드 꾸미기 소스코드 작성하기 예제 소스 티스토리에는 소스블럭 삽입 이라는 기능이 있습니다. 글쓰기 시 위와 같은 방식으로 소스 블럭을 삽입 할 수가 있습니다. 글쓰기의 화면은 위와 같지만 글 작성 후 실제화면은 아래와 같이 표출됩니다. 배경색과 테두리, 글자 들여쓰기, 폰트가 그대로 표출되지 않고 변경되는걸 볼 수가 있어요 예상대로 글이 표출되지 않고 보기 이쁜 상태가 아닌지라... 오늘은 이 소스블럭을 글쓰기와 같이 꾸미는 방법을 소개하겠습니다. 먼저 관리 페이지 좌측 하단에서 스킨 편집을 누릅니다. 표출되는 페이지 상단 CSS를 누를경우 style.css 파일을 수정할 수 있습니다. 수천 줄의 소스코드가 작성 되어있는데요. 모든 소스를 볼 필요 없습니다. 특정 영역만 수정해주면 되는데요~ 어떤 영역을 수정해야 우리가 원하는 코드블록을 변경.. 2020. 12. 29.
ionic spinner 예제 example ionic spinner를 통하여 데이터 리스트를 통신하는 동안 페이지에서 데이터를 가져오고 있다고 표시할 수 있다. 이를 위하여 4가지 처리를 해주어야 한다. 1. 노출 처리를 위한 변수 생성 2. 생성자에 setTimeout으로 변수 값 변환처리 3. html에 ion-spinner 삽입 4. *ngIf 사용 알고리즘은 아래와 같다. ngif문을 사용하여 노출처리 변수값에 따라 내용은 비노출 ion-spinner은 노출한다. HTML 1.5초후 표출될 내용 TS //초기 변수 private isShow =true; //생성자 constructor() { //1.5초 후 false로 변경 처리 setTimeout(()=>{ this.isShow =false; },1500) } 2020. 12. 29.
ionic 안드로이드 기기로 프로그램 실행하기 STEP1 휴대폰 잭연결 STEP2 device 인식 프로그램 필요하면 설치 STEP3 설정 -> 개발자 모드 -> usb 디버깅 on STEP4 명령어 입력 연결 가능 기기 목록 보기 adb devices => R3CN4034DDD 이런식으로 기기 내역 나온다면 정상 연길 기기로 실행 ionic cordova run android --target="R3CN4034DDD" 2020. 12. 23.
android adb device 장치연결 인식 안됨 접속장비 :lg 20 1차 발생 usb 가 연결 되었다가 조금만 툭 건드리면 연결이 끊어짐. -> 선을 안 건들이고 작업함. 2차 발생 -> 현상이 심해짐 설정 -> 개발자 도구 -> USB 디버깅 off -> on off 로 해결됨 3차 발생 이젠 연결 자체가 안됨;;;; 잭 새로 구입. 위와 같이 설정을 건드리지 않았는데 충전만 되고 디버깅 접촉 불량이 발생한다면... 새로운 잭을 구매해야 한다. 4차 발생 잭 바꿨는데 되다가 또 안됨... 핸드폰 문제 or pc 환경 문제로 짐작되어서 컴퓨터 재부팅 했더니 다시됨 2020. 12. 22.
mysql 위도 경도 가까운 거리 계산 쿼리문 쿼리문 예시 SELECT 컬럼들, (6371*acos(cos(radians(lat좌표값))*cos(radians(lat좌표값))*cos(radians(lng좌표값) -radians(lng좌표값))+sin(radians(lat좌표값))*sin(radians(lat좌표값)))) FROM 테이블 HAVING distance 2020. 12. 21.
ionic 이미지 미리보기 css input 감춤처리 파일 선택시 업로드 전에 이미지를 미리보는 기능 HTML Upload SCSS #myFileInput{ position: absolute; opacity: 0; } .myFakeUploadButton{ /* Whatever you want */ } HTML ​위와 같은 방식으로 적용을 하면 된다. 실제 적용 소스 예제는 아래와 같다. HTML SCSS #myFileInput{ position: absolute; opacity: 0; } .myFakeUploadButton{ /* Whatever you want */ } TS //이미지 선택시 실행 selectedFile(event){ this.photo=event.target.files[0]; console.log(this.photo); this.proj.. 2020. 12. 21.