본문 바로가기
반응형

개발공부42

css 박스 모델과 display flex (1) 와 span은 기본적으로 inline 태그이기에 안에 내용이 없으면 화면에 표시가 안된다. 하지만 display 옵션을 block로 바꾸면 div처럼 사용이 가능하다. span { display: block;} CSS박스 모델???????? margin : 박스 테두리 바깥의 공간 border : 박스 테두리 - 선의 굵기, 모양, 색 지정 가능 border: 1px solid gray; padding : border 와 내부 컨텐츠 영역 사이의 공간 padding, margin, border적용시 일부분에만 적용하기 border-bottom: 1px solid black; padding-left: 20px; margin-right: 10px; 이런식으로 특정 부분만 적용 가능 또는 padding: 20.. 2023. 6. 27.
[슈퍼코딩]1일차 정리 html / css 기초 #슈퍼코딩 1일차 ​ - TO-DO LIST - ​ 1강 Orientation ~ 12강 CSS란? - 웹페이지를 Awesome하게 강의 듣기 일일보고 작성하기 ​ ​ - 배운 내용 요약 정리 - ​ 개발은 학문이 아니라 훈련에 가깝다 ​ 포지션을 정확히 이해하고 포지션의 역할을 충실히 해야 한다 ​ 모든 걸 알 필요는 없다 검색을 잘 하는 것도 개발자의 능력이다 (이 부분에서 크게 용기를 얻었어요 ㅜ ㅜ) ​ 컴퓨터처럼 생각하려면? 분해 : 큰 문제를 작게 쪼개서 패턴인식 추상화 알고리즘 : 문제 해결 과정을 단계적으로 ​ 디자인 참고 사이트 https://dribbble.com Dribbble - Discover the World’s Top Designers & Creative Professional.. 2023. 6. 26.
[슈퍼코딩] 1일차 중 스크래치 -블록형 프로그래밍 언어 / 노코드, 재미 오늘 드디어 슈퍼코딩 부트캠프 시작이다. 강의를 듣던 중 재밌는 것이 있어서 소개차 글을 올린다. 바로 스크래치 스크래치는 코드 입력 없이 알고리즘을 연습할 수 있다고 한다. 검색창에 스크래치라고 치면 맨 위에 나오는 사이트이다. 여기에 들어가면 이미 만들어져 있는 블록으로 코드 없이 프로그래밍을 경험해 볼 수 있다. 선생님이 내준 과제는 1 박쥐를 움직여서 2 박쥐가 빵에 닿으면 3 빵이 없어지면서 4 박쥐가 냠냠이라고 하는 것이었다. 그냥 한 번만 없애면 재미없으니까 박쥐가 빵에 닿으면 빵이5 임의의 장소로 이동하게끔 했다. 솔직히 개발 공부를 하면서 로직을 짜는 게 가장 힘든 거 같다. 그런 의미에서 간단한 프로젝트라도 이런 식으로 경험을 해보는 것도 좋은 거 같다. 요즘에는 초등학생 때 의무교육으.. 2023. 6. 26.
< / > 클론 코딩-Wordle(게임)__3 자바스크립트 - TO-DO LIST - 저번에 이어 워들 게임 클론 코딩을 진행. 완성 - 배운 내용 정리 - 이번에는 기능 구현까지 하면서 최종적으로 완성을 했다. - 구현한 기능들 - 엔터를 치면 정답 확인 후 다음 줄 진행 정답이 맞으면 초록색으로 표기 틀리면 회색으로 표기 자리는 안 맞지만 정답에 포함되어 있으면 누런색으로 표기 const handleEnterKey = () => { let 맞은_갯수 = 0; for (let i = 0; i { if (index > 0) { const preBlock = document.querySelector( `.board-block[data-index='${attempts}${index - 1}']` ); preBlock.innerText = ""; } if (index.. 2023. 6. 26.
반응형

티스토리툴바