본문 바로가기

전체 글109

position 1. static - position의 기본 속성으로 모든 요소가 기본적으로 static형태다. 2. relative relative는 해당 스타일이 적용된 요소가 본인 위치에서 움직이는 속성이다. 위에서 빨간 박스를 움직이기 위해 position의 relative속성을 지정하고 위에서 100px, 왼쪽에서 100px만큼의 거리를 두겠다고 지정하였다. 그 결과 기존위치에서 다른 곳에 빨간 박스가 위치하게 되었다. 3.absolute absolute는 상위 노드(부모노드) 중 postition이 relative가 있는 노드를 찾아 기준으로 삼아 그 안에서 움직인다. 빨간 박스를 파란색 박스안에서 움직이기 위해 파란 박스에 position을 relative로 설정하여 기준으로 삼고 빨간 박스에 absolut.. 2024. 4. 7.
flex속성? 1. flex속성이란? 2. 정렬 기준 3. 정렬 방법 1. flex속성이란? flex속성이란 특정 블록 내 자식 노드들을 정렬하기 위한 방법이다. 기본적으로 가로로 배치가 되며 블록형 태그와 인라인 태그를 구분하지 않는다. 원래 블록 속성을 가진 태그는 하나의 라인을 모두 차지하기 때문에 속성을 inline으로 직접 바꿔주지 않는 한 바로 옆에 붙을 수 없다. 하지만 위 이미지와 같이 flex로 설정되 블록의 자식 노드는 모두 블록, 인라인 할 것 없이 가로로 바로 옆에 위치하게 된다. 2.정렬 기준 우리가 물건을 세우는 것과 같이 어떤 것을 정렬한다고 하면 무조건 가로로만 배치하는 것이 아니다. 때에 따라 가로로, 다른 경우에는 세로를 기준으로 줄을 세우게 된다. flex 속성도 마찬가지로 기준을 설.. 2024. 4. 1.
프로그램?소프트웨어?애플리케이션? 1. 프로그램이란? 2. 소프트웨어란? 3. 애플리케이션? 우리는 컴퓨터를 사용하며 여러 기능을 사용하는데 보통 프로그램 혹은 소프트웨어라고 부른다. 뭔가 느낌상 프로그램보다 소프트웨어라고 부르는 것이 있어보인다. 단순히 서로 부르는 명칭이 다르고 같은 것인가? 이들의 의미를 알아보도록 하자. 1. 프로그램이란? 어떠한 문제를 해결하기 위해 컴퓨터가 이해할 수 있도록 처리 방법과 순서를 기술한 명령의 집합이다. 정의된 내용이 어렵다면 프로그램은 어떤 문제를 다루는 기능을 실행하는 것이라고 생각하면 이해가 쉬울 것 같다. 2. 소프트웨어란? 그럼 소프트웨어는 프로그램과 다른가? 어떤게 다른지 확인하기 전 소프트웨어가 뭔지 확인해보자 소프트웨어는 프로그램과 개발,관리,유지보수 등에 관한 정보를 포함한 개념 .. 2024. 3. 29.
HTML 1. HTML이란? 2. Hyper Text 3. Mark up 우리는 웹에서 보여지는 이미지, 버튼, 글, 입력 폼들이 적절히 위치하여 다채로운 모습을 하고 있는 화면을 웹 문서라고 한다. 그런데 왜 “웹 문서”(또는 웹 페이지)라고 하는 것일까? 우리가 알고 있는 문서는 정보를 위한 그림이나 글이 작성된 종이를 뜻한다. 그럼 웹 문서는 웹에서 보여지는 정보가 담긴 글이어야 하지만 여러 사이트를 보면 그렇지 않은 경우가 많다. 이들이 문서라고 보여지는 이유를 알아보자. 1990년대 영국의 물리학자인 팀 버너스리가 연구소의 연구원들에게 신속한 정보와 문서를 공유하기 위해 HTML을 제안하여 만들어졌다. 그렇다. 말 그대로 HTML로 만들어져 웹을 통해 공유되는 정보성 문서였기 때문에 “문서”라고 불렀던 .. 2024. 3. 28.

티스토리툴바