몰까로그

>> 문제 보러 가기 https://www.acmicpc.net/problem/10951 10951번: A+B - 4 두 정수 A와 B를 입력받은 다음, A+B를 출력하는 프로그램을 작성하시오. www.acmicpc.net >> 문제 풀이 while (scan.hasNextInt()) { left = scan.nextInt(); right = scan.nextInt(); System.out.println(left + right); } scan.hasNextInt() Scanner에 있는 기본 메소드로 입력 값이 int일 때 true 반환 값을 입력하지 않고 엔터키 클릭 시 false반환 해 반복문 탈출 처음에는 문제가 잘못 됐나? 왜 입력 종료 조건이 없지? 생각했는데 그냥 내 지식이 잘못되었던,,, 부..

목록을 만들 때 사용하는 리스트 태그들에 대해 알아보겠습니다. 리스트 태그는 global navigation bar를 구현할 때 많이 씁니다. 여러 게시글이나 이미지 등을 개념적으로 묶어 관리하고자 할 때 용이한 거 같네요. (1) 순서가 없는 , 태그 : 의 자식으로 가 옵니다. 구현은 아래와 같이 하면 되는데요. 각 항목 앞에 불릿이 붙고 css의 'list-style-type'으로 불릿 수정이 가능합니다. li간에 순서가 부여되지 않습니다. 순서가 없는 ul 태그 자식으로 li 태그만 가능 각 항목 앞에 불릿 붙음 css로 불릿 수정 가능 (2) 순서가 있는 , 태그 : 의 자식으로 가 옵니다. 구현은 다음과 같습니다. 각 항목 앞에 숫자가 붙고 css의 'list-style-type'으로 불릿 수..

Git이란 내 local 컴퓨터에서 수정한 내용, 과거 히스토리를 모두 기록해두는 시스템이다. Github는 로컬이 아닌 cloud에서 이를 관리하는 시스템으로, 다른 사람들과 코드 공유가 가능하고 협업에 용이하다. terminal을 열고 명령어를 입력해 git을 관리한다. vscode를 사용한다면 ctrl + ` 를 눌러서 터미널 창을 열 수 있다. ☆ Local부터 Github까지 가려면? 내 컴퓨터에서 그냥 파일을 만들고 작업을 하면 그 파일은 local의 working directory에 저장이 된다. git을 이용해 기록하고 싶다면 우선 저장소를 생성해야 한다. git init : git 저장소를 생성하는 코드 git status : 현재 git의 상태 나타냄 저장소를 생성했지만 아직 git에 ..

display: flex; 레이아웃 배치를 위한 전용 기능으로 고안된 기능. 인터넷 익스플로러 구 버전에서는 지원 안 되기도 함. IE 10, 11 지원. box1 box2 box3 위와 같이 html 구조를 설정해, box들을 가로로 나란히 병렬하고 싶을 때. 부모요소인 container에 display: flex;를 적용해 사용. container가 flex의 영향을 받는 공간이며, 그 안에 자리잡는 item들이 설정한 속성에 따라 배치됨. ***** flex 적용 속성 ***** ◎ item 적용 속성 (1) flex-basis // 아이템 기본 크기 설정 flex-direction이 row일 때는 width를, column일 때는 height를 설정. width를 설정하면 아이템이 width보다 ..

display: flex; 레이아웃 배치를 위한 전용 기능으로 고안된 기능. 인터넷 익스플로러 구 버전에서는 지원 안 되기도 함. IE 10, 11 지원. box1 box2 box3 위와 같이 html 구조를 설정해, box들을 가로로 나란히 병렬하고 싶을 때. 부모 요소인 container에 display: flex;를 적용해 사용. container가 flex의 영향을 받는 공간이며, 그 안에 자리 잡는 item들이 설정한 속성에 따라 배치됨. ***** flex 적용 속성 ***** ◎ container 적용 속성 1) display: flex; // flex 선언 .container { display: flex; } 가로 방향으로 배치. item들의 width는 item이 가진 내용물 만큼, he..

텍스트를 묶는 , , 태그 등은 묶는 내용 다음에 자동으로 줄바꿈이 들어갑니다. 이번에는 줄바꿈 없이 문장 안 단어에 의미를 주는 태그들에 대해 알아보겠습니다. (1) 굵게 표시하는 , 태그 : 텍스트를 굵게 만들어 볼드처리를 해주는 태그입니다. 여는태그와 닫는태그 사이에 내용을 입력합니다. 태그는 중요한 내용이라 강조할 필요가 있을 때 사용합니다. 태그는 단순히 굵게 표시할 때 사용합니다. 이러한 기능은 css에서도 조절 가능하기 때문에 잘 사용하지 않습니다. 내용을 강조하는 의미가 있는 태그를 적재적소에 사용하면 좋습니다. (2) 이텔릭체로 표시하는 , 태그 : 이텔릭체로 글꼴을 표기해주는 태그입니다. 여는태그와 닫는태그 안에 내용을 입력합니다. (1)번과 마찬가지로 은 중요한 내용을 강조하는 의미로..

빠른답변>> 더보기 더보기 margin-left: auto;를 마지막 자식박스에 적으면 된다. 웹페이지 스크롤을 맨 밑으로 내리면 보통 '페이지 로고', '주소 및 연락처', '저작권 표기' 등이 자리하고 있습니다. 대한민국 청와대 홈페이지는 왼쪽에는 로고와 각종 SNS연결 아이콘이, 가운데에는 연락처 정보가, 오른쪽에는 하단메뉴와 기타설명, 각종 인증 마크들이 있습니다. 저작권 표시는 그 밑에 해두었네요. 웹 편집기(여기서는 HTML5를 사용했습니다.)로 이를 구현해본다면, 각각의 내용을 크게 네가지 div 박스에 담아 위치를 조절할텐데요. 맨 밑의 저작권 표시는 냅두고, 위에 3개 박스의 display 설정을 flex로 선언해 가로로 정렬할 수 있겠습니다. 연습을 위해 html문서의 부분을 작성하면 ..

SCSS란 'Sassy CSS'의 약자로 '멋진 CSS'를 의미합니다. (멋쟁이~) 역할을 간단히 소개하면 CSS를 편리하게 이용하도록 도와준다고 할 수 있습니다. 가독성과 재사용성이 높고 CSS보다 표기법이 간단해 구조화된 표현이 가능합니다. CSS는 작업이 커질수록 불필요한 선택자가 많아지고 여러가지 한계가 생깁니다. 이를 해결하기 위해 개발된 게 SCSS와 SASS인데요. 여기서는 SCSS에 대해 간단히 알아보려 합니다. SCSS 사용을 위해 먼저 Extension에서 "Live Sass Compiler"를 설치해주세요. 그러면 아래쪽에 'Watch Sass'가 생성됩니다. SCSS 문서를 작성할 때는 한 번 클릭해서 상태가 'Watching...'으로 바뀌도록 설정해야 합니다. 그다음 설정의 'E..

웹 문서도 문서이지요. 많은 양이 텍스트로 이루어진 만큼 모든 태그들은 텍스트를 묶는 박스라 볼 수 있습니다. 그 중에서도 가장 텍스트다운(?) 태그들을 먼저 알아볼 건데요. 제목을 의미하는 태그, 본문을 의미하는 태그, html에서 줄바꿈은 어떻게 하는지, 띄어쓰기는 어떻게 넣는지 등을 알아보고자 합니다. (1) 제목을 표시하는 태그 : 각 콘텐츠 영역에서 제목을 표시할 때 사용합니다. 숫자가 적을수록 중요도가 높음을 의미하며 그에 따라 크기도 커집니다. 하지만 text-size는 나중에 css에서 변경 가능한 부분이니, 글자 크기가 기준이 아닌 내용의 중요도를 기준으로 사용해야 합니다. 웹문서에서 검색할 때 대상이 되는 순위이기도 합니다. h1제목입니다. h2제목입니다. h3제목입니다. h4제목입니다..

태그를 사용할 때는 소문자로 쓰기 적당히 들여쓰기 닫는 태그 확인하기 HTML 문서 내용은 태그를 사용하여 작성됩니다. 작성하려는 내용의 속성에 따라 알맞은 태그를 사용합니다. '태그를 사용할 때는'에서 이 태그에 해당합니다. 여는 태그와 닫는 태그가 있으며 태그처럼 닫는 태그가 없는 태그도 있습니다. 태그는 소문자로 작성되며 태그마다 가질 수 있는 속성들이 있습니다. 태그의 'src'가 그 예시입니다. HTML 문서의 기본 구조는 아래와 같습니다. - 작성하는 문서가 HTML5로 작성된 웹 문서라는 뜻입니다. 웹 브라우저에게 처리할 문서가 어떤 유형인지 알려주는 역할을 하죠. doctype은 대문자로 써도 무방합니다. - 웹 문서의 시작과 끝을 나타내는 태그입니다. 웹 브라우저가 웹 문서를 읽을 때 H..