반응형 html6 HTML checkbox 체크박스 일괄선택(전체선택), 일괄취소(전체취소) See the Pen Untitled by Junho Yoon (@junhoyoon95) on CodePen. 오늘은 HTML 파일 내에서 쉽게 전체체크, 전체취소 기능을 만들어 보았어요. JS 로 빼놓은 기능을 script 태그에 넣으셔도 무방합니다. 유의하실 점은, 저는 $태그로 정보를 가져오고 있기에, 위와 같이 jquery 를 cdn 으로 들여왔어요. 성능에 저하가 있거나, 데이터를 많이 잡아먹지 않습니다. 넌무 걱정없이 사용하셔도 됩니다. 더 편한 방법들은 항상 존재합니다 각자의 입맛에 맞는 것을 찾아 연습하면 좋을 것 같아요 :) 2022. 10. 3. html text outline css, 텍스트 테두리 입히기 가끔 버튼을 만들고 그 안에 문구를 넣을 때에, 바탕이 너무 밝아, 흰색 텍스트를 쓰는 경우 잘 보이지 않는 경우가 있다. 이런 경우 글자에 테두리를 넣고 싶다. 그러면 어떻게 하는 것이 좋을까? 너무 간단해서 화가 난다. style ="-webkit-text-stroke: 1px black;" 끝. 2021. 8. 11. 줄바꿈, 칸 크기 조절 가능한 입력창 만들기 문제 발생 일반적으로 이름, 번화번호, 이메일 정도나 적던 input 칸에는 그렇게 많은 공간이 필요하지 않죠. 그래서 우리는 그저 일반적인 태그를 쓰게 되었습니다. 하지만 주문시 요청사항 혹은 기타 메모 등과 같은 입력 공간에는 줄바꿈(enter)이나 크기 변경, 안의 내용에 따라 크기가 변하는 input이 필요하게 되었습니다. 오늘은 이 부분을 해보시죠 해결 방법 TypeScript // 여기는 input으로 memo를 넣는 부분에서 text 칸이 유동적으로 변화하게 만드는 부분 const tx = document.getElementsByTagName("textarea"); for (let i = 0; i < tx.length; i++) { tx[i].setAttribute("style", "heig.. 2021. 7. 7. Angular html checkbox multiple selection, 체크박스 여러개 선택해 저장하기 문제 발생 항상 이름은 하나, 번호도 하나, 이메일도 하나, 이런 식으로 저장을 하는 것에 익숙해져있던 때에, 이메일을 여러개 가지고 있고 싶은 사람, 번호도 여러개인 사람도 생겨나고, 다른 새로운 테이블(firestore 상의 collection)이 생겨날 때 마다 데이터를 저장하는 방식도 필드당 하나가 아니라 여러개의 선택지가 주어져야 하는 경우도 많이 생겨나기 시작했다. 해결 방법 일단 어떻게 저장할 지는 방법은 너무 많다. array도 가능하고, subcollection 도 가능하다. 하지만 고작 하나의 정보를 저장하자고 subcollection을 사용하려들면 줘패고싶다. 예를 들어 한 의류 쇼핑몰 사이트에 여러 업체들이 등록되는 거라면 업체 collection에 업체마다 sub-collectio.. 2021. 7. 7. <select> <option value =1> number (int), string 오류 해결 문제 발생 html 1학년 2학년 3학년 typescript selectGradeHandler(event: any) { this.grade = event.target.value; } 우리는 value = "1" 이라 하면 1이라는 string으로 저장이 될 터이니, value = 1 이라고 하거나 grade를 number나 int 와 같은 숫자의 형태로 선언을 했다면 하면 숫자로 저장이 될 것일고 믿었다. 그런데... 아니었다... 이렇게 한참을 개발하고 나중에 === (타입과 값을 동시에 비교하는 것) 로 비교를 했는데 숫자 타입이 아니라는 오류가 났다... 반년간 운영된 웹사이트에 이런 식으로 데이터가 쌓여오던 것이었다. 개패고싶다. 하지만 == 으로만 비교하면 되므로 일단 패스. 이 글을 읽게 되는.. 2021. 7. 6. <title> 브라우저 탭 아이콘, 탭 제목 1. 브라우저의 탭 아이콘을 설정하는 방법 (난이도 1~100 중 15?) 사용하는 방법은 거의 다 비슷하고 어렵지 않은 과정이죠. 물론 다른 프로젝트를 진행하게 된다면 또 다른 부분이 필요할테지만 지금은 Angular을 사용하고 있으니, 이런 것이 있구나, 이렇게 부르는 구나 정도를 알아보고 Angular로 브라우저의 탭에 들어가는 아이콘, 즉 Favicon 을 설정하는 방법을 기록한다 Angular에서 가장 처음 프로젝트를 생성한다면 app.component.ts가 src 최상단에 생기게 된다. app.component.ts로 간다. 거기서 가장 처음 내가 한 행위는 Favicon 설정, 다중 언어를 사용하는 사이트이기 때문에 처음에 언어를 영어로 설정하는 방법을 세팅했다. → 네비게이션 바에 국기버.. 2021. 5. 12. 이전 1 다음 반응형
