본문 바로가기

분류 전체보기

(60)
[오늘의 학습] 211110 CSS 미디어쿼리 사용 단말기의 유형이나 특성 수치(화면 해상도, 뷰 포트 너비)에 따라 스타일 수정시 활용 미디어 유형 : all, print, screen, speech all : 모든 장치 대상 print : 출력 미리보기 화면에 표시할 문서 screen : 화면 대상 speech : 음성 합성장치 대상 논리연산자 : not, and, only not : 미디어 쿼리 부정하는 연산자 and : 다수의 특성 조합시 사용하는 연산자, 모든 특성을 만족해야 한다. 기타 코딩 컨벤션 코딩 작성 표준 문법에 맞게 작성하면 아무 오류없이 작동하겠지만, 작성하는 방식이 다양하게 나타날 수 있다. 협업할 경우 유지보수의 효율을 높이기 위해서 작성하는 방식을 통일하는 것이 좋다. 코딩 컨벤션 문서에 주석, 들여쓰기..
[오늘의 학습] 211109 CSS SVG 확장 가능한 벡터 그래픽(Scalable Vector Graphics), 2차원 벡터 그래픽을 표현하기 위한 XML 기반의 파일 형식(1999년 W3C 개발) 이미지를 키워도 깨지지 않고, 용량이 늘어나지 않는다. 복잡한 이미지일 경우 용량이 커진다. 적용 방식 태그 활용(src 속성으로 연결) CSS의 background 속성으로 연결 HTML 문서 내 인라인으로 작성(코드가 지저분하기 때문에 비선호) 가상클래스 :hover 사용자의 커서(마우스 포인터)가 요소 위에 올라가 있으면 활성화 :active 사용자가 요소를 실행(마우스 클릭)하여 활성화 :focus 요소를 포커스하여 활성화 transition ':hover', ':active' 함께 작동 형태 - transition : (pr..
[오늘의학습] 211108 CSS flex axis, cross-axis 레이아웃을 배치할 때, 참고하는 기준 axis의 상태(row || column)에 따라 cross-axis는 반대로 따라간다. align-items cross-axis 기준으로 배치되는 속성 flex-container 태그에 적용 값 종류 : stretch, center, flex-start, flex-end align-content cross-axis 상에 여러 아이템들이 존재할 경우 사용하는 속성 값 종류 : start, center, space-between, space-around flex-wrap flex 적용된 아이템들을 묶어주는 속성 강제로 한 줄에 배치하거나 허용 범위 안에서 여러 행으로 나누어 배치할지 결정 값 종류 : nowrap, wrap..
[오늘의 학습] 211029 학습 언어 HTML, CSS 학습 방식 온라인 강의 정리('[코드라이언]일단 만드는 HTML/CSS' 강의를 참고하였습니다.) 학습 내용 학습한 Tag : html, head, meta, link, title, body, div, p, h1, img, a, footer Tag class 작성 : 같은 Tag에서 다른 스타일(CSS) 적용시 활용 학습한 CSS 속성 : margin, padding, border, width, height, background-color, color, text-align, font-size, font-weight, font-style, box-shadow, float, overflow ① 오른쪽 위치 시키기 선구자 치타 HTML/CSS 개발자 .title-box { text..
[프로그래머스] 상호평가 with JavaScript 상호평가(LEVEL 1) 위클리 챌린지 문제보기 내가 제출한 답안 function solution(scores) { var answer = ''; let avg = []; for (let i = 0; i add + currValue); let countMax = tmp.filter(element => Math.max(...tmp) === element).length; let countMin = tmp.filter(eleme..
[프로그래머스] 부족한 금액 계산하기 with JavaScript 부족한 금액 계산하기(LEVEL 1) 위클리 챌린지 문제보기 내가 제출한 답안 function solution(price, money, count) { var answer = 0; for (let i = 1; i < count + 1; i++) { answer += i * price; } return answer
[Git] Git 처음 시작과 상태 Git 처음 시작 Git을 사용하는 이유 버전관리 한 파일로 버전을 관리한다. → 내용이 수정, 삭제, 추가되어도 새로운 파일을 만들지 않아도 된다. 파일을 관리하다가 실수했을 경우에 과거의 내용으로 복귀하기가 수월하다. 협업 다수의 인원이 한 프로젝트, 파일을 관리할 때, 소통하기가 수월하다. 팀원간 변경된 내용이 중복되어도 Git에서 인식하여 내용을 통합시킨다. 팀 내에서 Git 사용원칙을 잘 세워야 개발 흐름이 꼬이지 않는다. Git 설치하기 Git 공식 홈페이지(이동)에 접속하여 사용자의 현재 상황에 맞는 설치파일을 다운로드 한다. 설치파일을 실행하여 설치를 진행할 때, 특별한 설정없이 'next'를 누르게 되면 기본 설정으로 설치된다. Git 사용하기 Git 설치가 끝났으면 다양한 방법으로 사용..
[JS] Date(표준 빌트인 객체)의 프로퍼티와 메서드 Date 객체 날짜와 시간(Year, Month, Day, Hour, Minute, seconds, millisecond)을 제공 UTC : 협정 세계시, 국제 표준시, GMT(그리니치 평균시) KST : 한국 표준시, UTC에서 9시간을 더한 시간(UTC 00:00 AM === KST 09:00 AM) 시간 값은 자바스크립트 내 시스템의 시계에서 결정 밀리초 환산 1초 === 1,000ms 1분 === 60초 * 1,000ms === 60,000ms 1시간 === 60분 * 60,000ms === 3,600,000ms 1일 === 24시간 * 3,600,000ms === 86,400,000ms Date 생성자 함수 new Date() asdf new Date(milliseconds) Date 메서드 D..