나의 모양

💙 실습 트위틀러 목업 구현 트위틀러: 가짜 트위터 실습 내용: 주어진 이미지와 함께 최소한의 html, css 그리고 이미 만들어진 js로 창의력 한 스푼을 더해 트위틀러 목업을 만드는 것 HTML 더보기 twittler Username Message Tweet! Check New Tweets CSS 더보기 #greeting { font-size: 24px; font-family: sans-serif; font-weight: bold; border-radius: 1em; color: #2aa9e0; background-color: white; text-align: center; margin: 0.5em; padding: 0.5em; } #box1 { background-color: #e8f5fd; p..

📌 페이지 레이아웃 💙 레이아웃: 화면을 나누는 방법 🤍 HTML 구성하기 콘텐츠 흐름: 좌 → 우 / 위 → 아래 CSS 화면 구분 수직분할: 콘텐츠 가로 배치 수평분할: 내부 콘텐츠의 세로 배치 수평분할 + height ⇒ 직관적인 수평 분할 가능 아이콘 1 아이콘 2 아이콘 3 영역1 영역2 영역3 영역4 영역5 /* CSS */ .w70 { width: 70%; } .h40 { height: 40%; } 🤍 레이아웃 리셋 박스를 잡는데 있어 HTML의 기본 스타일로 인한 어려운 점 태그 기본 스타일에 약간의 여백이 있음 width, height 계산에 여백 불포함 (003의 박스모델 참고) 브라우저마다 다른 기본 스타일 해결방법 기본 스타일링 제거 * { box-sizing: border-box;..

🤍 HTML(HyperText Markup Language) 태그(tag)들의 집합 tag: 로 묶인 HTML의 기본 구성 요소 Semantic Tag: 각 요소의 역할을 명확하게 규정해주는 것, 직관적인 내용 파악 HTML elements reference - HTML: HyperText Markup Language | MDN HTML elements reference - HTML: HyperText Markup Language | MDN This page lists all the HTML elements, which are created using tags. developer.mozilla.org 열고(closing tag) 가 한 쌍이지만, 닫는 태그가 없을 경우 연 태그 맨 마지막에 / 붙여주면 ..

🤍 컴퓨터의 이해 컴퓨터: 입력받은 데이터를 정해진 규칙대로 처리해서 처리 결과를 저장하고 출력하는 장치 컴퓨터의 구성요소 정해진 규칙대로 → 소프트웨어 입력받은 데이터를 처리해서 처리결과를 저장하고 출력하는 장치 → 하드웨어 ⇒ 소프트웨어와 하드웨어의 상호작용으로 동작 소프트웨어 하드웨어의 동작을 지시하고 제어하는 명령어의 집합 시스템 소프트웨어(System Software) 응용 소프트웨어(Application Software) 하드웨어 컴퓨터를 구성하는 물리적 장치 분류: 중앙처리장치, 기억장치, 입력장치, 출력장치 ⇒ 시스템 버스로 연결 중앙처리장치(CPU, Central Processing Unit) (= 프로세서): 컴퓨터의 핵심장치로, 프로그램 실행 & 데이터 처리 담당 제어장치: CPU의 ..

개강날! 각자 안내된 사전 안내 문서를 읽고 줌에서 운영방식에 관한 OT 시간을 가졌다. 안내 해주시는 분들 다 참 친절하시고 적극적이시다. 수업 종료 후 깃허브 초대에 문제가 있는 것 같아 문의했는데 바로 조치를 취해주셔서 금방 해결됐다! 🏫 Orientation react okay: press 1, nokay: press 2 온라인 수업 시 반드시 카메라 켜기 학습 툴 설정 출결관리 로그인: 06-08, 로그아웃: 18-20 외출 시 해당 시간에 로그아웃하기 📝 학습 내용 메타인지 생각에 관한 생각으로 뭘 알고, 뭘 모르는지 아는 것 => 나의 상태 객관화 효과적으로 메타인지를 훈련할 수 있는 방법: 회고 페어프로그래밍 기대효과: 의사소통, 배운 것 설명, 자기객관화 의사코드: 길을 잃지 않게 도와주..