본문 바로가기
728x90

전체

 (92)
[HTML/CSS] 7. 도형만들기 css코드 div{ border-width: 10px; border-style: dashed; border-color: blue; width: 100px; height: 100px; } 출력결과 border를 이용하여 테두리를 만들 수 있다. border-width : 선 굵기 border-style : 선 모양 solid (실선) dotted (점선) dashed (대쉬선) double (이중실선) border-color : 선 색깔 css코드 div{ border: 10px double darkgreen; width : 100px; height: 100px; } 출력결과 css코드 div{ border-top : 10px solid deeppink; border-left : 10px dashed bl..
[HTML/CSS] 6. 단위와 위치 절대 단위 : 고정된 값을 출력 (출력장치의 물리적 속성을 아는 경우 효율적) → in, cm, mm, pt, pc 상대 단위 : 다른 요소의 크기에 영향을 받아 크기가 변함 (호환성을 유지하는데 유리) → em, ex, px, % 자주 사용하는 상대 단위 em : font_size, 해당 폰트의 대문자 M의 너비를 기준으로 함 ex : x-height, 해당 폰트의 소문자 x의 높이를 기준으로 함 px : pixel, 출력장치에 따라 상대적인 크기를 가짐 % : percent, 기본 글꼴의 크기에 대하여 상대적인 값을 가짐 위치 지정하기 1. static 모든 요소의 default 값이다. 포지션 속성을 따로 설정하지 않았을 때 자동으로 적용되는 것 가장 위쪽, 왼쪽에 배치된다. 2. relative ..
백준 100809 알파벳 찾기 [python] https://www.acmicpc.net/problem/10809 10809번: 알파벳 찾기 각각의 알파벳에 대해서, a가 처음 등장하는 위치, b가 처음 등장하는 위치, ... z가 처음 등장하는 위치를 공백으로 구분해서 출력한다. 만약, 어떤 알파벳이 단어에 포함되어 있지 않다면 -1을 출 www.acmicpc.net 문제 알파벳 소문자로만 이루어진 단어 S가 주어진다. 각각의 알파벳에 대해서, 단어에 포함되어 있는 경우에는 처음 등장하는 위치를, 포함되어 있지 않은 경우에는 -1을 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 단어 S가 주어진다. 단어의 길이는 100을 넘지 않으며, 알파벳 소문자로만 이루어져 있다. 출력 각각의 알파벳에 대해서, a가 처음 등장하는 위치, b가 처음 등장하는 ..
백준 11720 숫자의 합 [python] https://www.acmicpc.net/submit/11720 로그인 www.acmicpc.net 문제 N개의 숫자가 공백 없이 쓰여있다. 이 숫자를 모두 합해서 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 숫자의 개수 N (1 ≤ N ≤ 100)이 주어진다. 둘째 줄에 숫자 N개가 공백없이 주어진다. 출력 입력으로 주어진 숫자 N개의 합을 출력한다. 예제 입력 1 복사 1 1 예제 출력 1 복사 1 예제 입력 2 복사 5 54321 예제 출력 2 복사 15 예제 입력 3 복사 25 7000000000000000000000000 예제 출력 3 복사 7 예제 입력 4 복사 11 10987654321 예제 출력 4 복사 46 #소스코드 input() s = list(input()) x = 0 for ..
[HTML/CSS] 5. 클래스 , 패딩과 마진 클래스 (class) css에 디자인 속성을 일일히 지정해 줘야 하는데 이런 귀찮음을 해소할 수 있는게 바로 '클래스' 선택자이다. class의 이름을 지정해줘야 한다. class 이름을 'lighter' 라고 하겠다. #html 코드 볼드체 #css 파일에서 클래스를 불러올 떄는 '.클래스명' 으로 입력 .light{ font-weight: lighter; } html에 bold 클래스 이름을 붙이고, css에서 위와 같이 실행하면 모든 bold 클래스가 두꺼운 볼드체로 적용된다. 패딩(padding)과 마진(margin) 패딩과 마진은 웹 페이지에서 여백으로 사용되는 요소이다. 패딩(padding) : 속을 넣다, 채워 넣다 마진(margin) : 여백, 여유' 파란색 부분이 콘텐츠, 초록색 부분이 ..
[HTML/CSS] 4. css css란 웹 문서의 스타일 시트이다. html에서 웹에 관한 내용을 구성한다면, css는 디자인 역할을 맡고 있다. 폰트, 글씨 크기, 색, 도형, 정렬 등등 웹 페이지의 내용을 제외한 모든 디자인 부분 1. Inline Style Sheet 첫 번째는 html 태그의 속성에 css코드를 넣는 방법이다. 고양이는 귀여워 이라는 태그 안에 속성 값을 만들어 글씨에는 검은색, 배경에는 연두색을 적용하였다. 디자인 요소를 태그마다 하나하나 지정해 줘야 하기 때문에 한계가 있으며 재사용이 불가능하다. 2. Internal Style Sheet 두 번째는 안에 안에 css코드를 넣는 방법이다. 고양이는 귀여워 html 문서 안에 태그를 넣어 디자인을 적용했다. ( 태그는 보통 사이에 넣지만 어디에 넣어도 상관없다..
[알고리즘] bfs를 이용한 지하철 노선도 구현 코딩 너비 우선 탐색(BFS, Breadth-First Search) 너비 우선 탐색이란 루트 노드(혹은 다른 임의의 노드)에서 시작해서 인접한 노드를 먼저 탐색하는 방법 시작 정점으로부터 가까운 정점을 먼저 방문하고 멀리 떨어져 있는 정점을 나중에 방문하는 순회 방법이다. 즉, 깊게(deep) 탐색하기 전에 넓게(wide) 탐색하는 것이다. 사용하는 경우: 두 노드 사이의 최단 경로 혹은 임의의 경로를 찾고 싶을 때 이 방법을 선택한다. Ex) 지구상에 존재하는 모든 친구 관계를 그래프로 표현한 후 Ash와 Vanessa 사이에 존재하는 경로를 찾는 경우 깊이 우선 탐색의 경우 - 모든 친구 관계를 다 살펴봐야 할지도 모른다. 너비 우선 탐색의 경우 - Ash와 가까운 관계부터 탐색 너비 우선 탐색(BFS)..
[HTML/CSS] 3. 중요태그 정리 자주 쓰이는 태그 1. 문장을 나누는 태그 1) 태그 (paragraph) : 문단을 지정하는 기능 2) 태그 (line break) : 줄을 바꾸는 기능 #코드 강아지 정보 1.사람을 잘 따른다. 2.산책을 좋아한다. 3.너무 귀엽다. 고양이 정보 1.자기 맘대로 한다. 2.사람에게 순종적이지 않다. 3.매우 귀엽다 #출력결과 라는 태그를 쓰니 두 줄 사이에 공백을 두고 문단이 구분된다. #코드 강아지 정보 1.사람을 잘 따른다. 2.산책을 좋아한다. 3.너무 귀엽다. 고양이 정보 1.자기 맘대로 한다. 2.사람에게 순종적이지 않다. 3.매우 귀엽다 #출력결과 2. 범위를 나누는 태그 1) 태그 (division) : 영역을 나누는 기능 (한 페이지 내에서 영역을 지정해줌) 2) /a> 형식으로 작성된..
728x90

티스토리툴바