728x90 Study50 [CSS] flexboxfroggy로 재미있게 공부하기 2024.05.15 - [Study] - [CSS] flexboxfroggy로 재미있게 공부하기 justify-content [CSS] flexboxfroggy로 재미있게 공부하기 justify-contenthttps://flexboxfroggy.com/#ko Flexbox FroggyA game for learning CSS flexboxflexboxfroggy.comcss를 다 안다고 생각했지만 막상 해보려니 기억이 안 날 때 해보면 좋은 게임(?) 1단계왼쪽에 있는 초록색 개구리를 오른쪽suyeon-2.tistory.com5단계위에 있는 개구리들을 맨 아래 수련잎으로 옮겨야 합니다.#pond { display: flex; align-items: flex-end;}align-items: flex-en.. 2024. 5. 17. [CSS] flexboxfroggy로 재미있게 공부하기 justify-content https://flexboxfroggy.com/#ko Flexbox FroggyA game for learning CSS flexboxflexboxfroggy.comcss를 다 안다고 생각했지만 막상 해보려니 기억이 안 날 때 해보면 좋은 게임(?) 1단계왼쪽에 있는 초록색 개구리를 오른쪽 수련잎으로 옮겨야 합니다.#pond { display: flex; justify-content: flex-end;}justify-content: flex-end; 를 사용하여 개구리를 컨테이너의 오른쪽으로 정렬합니다. 2단계이번에는 개구리가 두 마리 등장합니다.컨테이너의 중간에 수련잎이 있는 것으로 보입니다.#pond { display: flex; justify-content: center;}justify-conten.. 2024. 5. 15. 웹 접근성 간단 정리 웹 접근성이란? 이니셔티브(Web Accessibility Initiative) 또는 줄여서 WAI는 장애인들의 월드 와이드 웹에 대한 접근성을 향상시키기 위해 W3C에서 만든 개념웹 접근성을 위해 사용되는 보조기기: 자막, 스크린리더, 자동완성 기능, 색상 대비 디자인 등 웹 접근성을 준수하는 방법 1. 시각적 요소 처리2. 청각적 요소 처리3. 키보드 접근성4. 웹 접근성 검사 https://ko.wikipedia.org/wiki/%EC%9B%B9_%EC%A0%91%EA%B7%BC%EC%84%B1_%EC%9D%B4%EB%8B%88%EC%85%94%ED%8B%B0%EB%B8%8C 웹 접근성 이니셔티브 - 위키백과, 우리 모두의 백과사전위키백과, 우리 모두의 백과사전. 웹 접근성 이니셔티브(Web Acc.. 2024. 5. 14. 웹 표준 간단 정리 웹 표준이란?W3C(World Wide Web Consortium)에서 권고하는 웹에서 표준적으로 사용되는 기술이나 규칙사용자의 운영체제나 브라우저의 영향을 미치지 않고 웹 페이지가 동일하게 보이고 정상적으로 작동웹 개발에 사용하는 언어인 HTML(구조), CSS(표현), JavaScript (동작)등의 기술을 담음현재 크롬, 엣지, 사파리 등 최신 웹 브라우저들은 모두 웹표준을 지원함. 장점 1. 유지보수의 용이성2. 웹 호환성 확보3. 웹 접근성 향상Semantic HTML의 중요성웹 표준에서는 HTML을 시멘틱(semantic)하게 작성하는 것의 중요성을 강조semantic : 의미의, 의미가 있는 이라는 뜻의 영단어HTML : 화면의 구조를 만드는 마크업 언어시맨틱 요소를 사용한다면 웹 표준 충족.. 2024. 5. 13. [JS] 계산기 만들기 간단하게 만들어 볼 수 있는 계산기를 만들어보기 ~~~~ 🤩 폰트는 내가 자주 사용하는 눈누 사이트에서 가져와서 사용하였다.상업용 무료 폰트 사이트 !!!!!https://noonnu.cc/ 눈누상업용 무료한글폰트 사이트noonnu.cc @font-face { font-family: 'LINESeedKR-Bd'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Bd.woff2') fo.. 2024. 5. 2. [REACT] 리액트 쿼리 리액트 쿼리(React Query)는 React 애플리케이션에서 데이터를 관리하기 위한 라이브러리입니다. 주요 기능은 다음과 같습니다:데이터 캐싱 및 관리:리액트 쿼리는 데이터를 가져오고 캐시하여 상태를 관리합니다. 이를 통해 애플리케이션의 데이터 흐름을 효율적으로 관리할 수 있습니다.서버 요청 관리:비동기적으로 데이터를 가져오는데 필요한 서버 요청을 관리합니다. 자동으로 캐시된 데이터를 반환하거나, 요청이 완료될 때까지 로딩 상태를 처리합니다.쿼리 인터셉트:쿼리를 실행하기 전 또는 후에 특정 로직을 실행할 수 있는 기능을 제공합니다. 예를 들어, 로딩 상태를 설정하거나 에러를 처리하는 등의 작업을 수행할 수 있습니다.캐시 제어:쿼리 결과의 캐시를 수동으로 제어하거나, TTL(Time-To-Live)을 .. 2024. 5. 2. 이전 1 2 3 4 ··· 9 다음 728x90