📂 WEB/CSS

[CSS] input[type="radio"] 커스텀하기

[CSS] input[type="radio"] 커스텀하기🎈 체크박스 CSS 변경하기는 기본 디자인을 가지고 있다. 하지만 디자인시안에 따라 라디오 디자인도 변경해야 할 때가 있어서 정리해본다 기본 디자인디자인 적용🎈 HTML 태그 안에 과 ,  를 추가한다. 의 기존 디자인은 CSS로 안보이게 해주고 요소가 라디오 디자인이 될 것이다. 은 체크박스 옆에 텍스트가 들어갈 요소이다. 라디오1 라디오2 🎈 기존 check 박스 디자인 초기화input[type="radio"]를 안보이게 스타일을 적용해준다/* input 초기화 */input[type='radio'] { display: none;}🎈 checkbox 디자인하기스타일을 적용하면 html과 css로 원하는 input 디자인..

2024. 2. 18. 00:24

📂 WEB/CSS

[CSS] input[type="checkbox"] 커스텀하기

[CSS] input[type="checkbox"] 커스텀하기🎈 체크박스 CSS 변경하기는 기본 디자인을 가지고 있다. 하지만 디자인시안에 따라 체크박스 디자인도 변경해야 할 때가 있어서 정리해본다 기본 디자인디자인 적용 🎈 HTML의 기본 디자인은 CSS로 안보이게 해주고 요소가 체크박스 디자인이 될 것이다. 은 체크박스 옆에 텍스트가 들어갈 요소이다. 체크🎈 기존 check 박스 디자인 초기화input[type="checkbox"]를 안보이게 스타일을 적용해준다/* input 초기화 */input[type='checkbox']{ display: none;}🎈 checkbox 디자인하기스타일을 적용하면 html과 css로 원하는 input 디자인을 만들 수 있다/* (체크박스, 텍스트..

2024. 2. 18. 00:11

📂 JavaScript

[Javascript] JS 반복문 종류(for, for...of, for...in, forEach, map(), filter(), reduce())

1. for 문 일반적인 반복문으로, 초기화, 조건, 증감식을 사용하여 반복을 제어한다. for (초기화; 조건; 증감식) { // 반복 실행될 코드 } for (let i = 1; i { // 요소에 대한 작업 }); const array1 = ['a', 'b', 'c']; array1.forEach((element) => console.log(element)); // Expected output: "a" // Expected output: "b" // Expected output: "c" 💡 'forEach' 메서드는 반복 중간에 'break'문을 사용하여 반복을 중단 할 수 없다. forEach 메서드는 모든 요소를 순회하고 반복이 완료된 후에만 종료 된다. 다른 반복문 및 배열 메서드 (for, ..

2024. 2. 14. 16:29

📂 JavaScript/코딩테스트 - 프로그래머스

[프로그래머스 JS] n보다 커질 때까지 더하기( for...of, if문, break )

n보다 커질 때까지 더하기 🎈 문제설명 정수 배열 numbers와 정수 n이 매개변수로 주어집니다. numbers의 원소를 앞에서부터 하나씩 더하다가 그 합이 n보다 커지는 순간 이때까지 더했던 원소들의 합을 return 하는 solution 함수를 작성해 주세요. 🎈 제한사항 1 ≤ numbers의 길이 ≤ 100 1 ≤ numbers의 원소 ≤ 100 0 ≤ n < numbers의 모든 원소의 합 🎈 입출력 예 numbers n result [34, 5, 71, 29, 100, 34] 123 139 [58, 44, 27, 10, 100] 139 239 🎈 입출력 예 설명 입출력 예 #1 예제 1번의 numbers를 문제 설명대로 더해가는 과정을 나타내면 다음의 표와 같습니다. i numbers[i] ..

2024. 2. 14. 15:31

📂 JavaScript/코딩테스트 - 프로그래머스

[프로그래머스 JS] 원하는 문자열 찾기 (단항연산자, toUpperCase())

원하는 문자열 찾기 🎈 문제설명 알파벳으로 이루어진 문자열 myString과 pat이 주어집니다. myString의 연속된 부분 문자열 중 pat이 존재하면 1을 그렇지 않으면 0을 return 하는 solution 함수를 완성해 주세요. 단, 알파벳 대문자와 소문자는 구분하지 않습니다. 🎈 제한사항 1 ≤ myString의 길이 ≤ 100,000 1 ≤ pat의 길이 ≤ 300 myString과 pat은 모두 알파벳으로 이루어진 문자열입니다. 🎈 입출력 예 myString pat result "AbCdEfG" "aBc" 1 "aaAA" "aaaaa" 0 🎈 입출력 예 설명 입출력 예 #1 "AbCdEfG"의 0~2번 인덱스의 문자열은 "AbC"이며, 이는 pat인 "aBc"와 같습니다. 따라서 1을 r..

2024. 2. 14. 14:30

📂 JavaScript/코딩테스트 - 프로그래머스

[프로그래머스 JS] 카운트 업( for문, push(), map() 콜백함수 파라미터 )

카운트 업 🎈 문제설명 정수 start_num와 end_num가 주어질 때, start_num부터 end_num까지의 숫자를 차례로 담은 리스트를 return 하도록 solution 함수를 완성해 주세요. 🎈 제한사항 0 ≤ start_num ≤ end_num ≤ 50 🎈 입출력 예 start_num end_num result 3 10 [3, 4, 5, 6, 7, 8, 9, 10] 🎈 입출력 예 설명 입출력 예 #1 3부터 10까지의 숫자들을 담은 리스트 [3, 4, 5, 6, 7, 8, 9, 10]를 return 합니다. 💻 나의 풀이 for문을 사용하여 start_num에서 end_num까지 반복하면서 빈 배열에 반복하는 i 값을 추가해서 retrun 했다. function solution(start..

2024. 2. 14. 11:23