보호되어 있는 글입니다.
Web
CSS의 특징 살펴보기기본 스타일 시트h1, h2 등등은 따로 스타일을 지정하지 않아도 폰트 크기 등이 정해져 있습니다.이처럼 웹 브라우저 내에 내장된 기본 스타일 시트가 존재합니다. 적용 우선순위와 개별성 우리가 알던 h1 태그와 크기, 굵기 등이 모두 다릅니다.이처럼 사용자가 별도로 스타일을 정의하면 기본 스타일 시트보다 사용자의 정의가 우선시 된다는 것을 알 수 있습니다. 그렇다면 같은 태그에 여러 스타일을 정의하면 어떻게 될까요?마지막에 작성된 스타일이 적용된 것을 알 수 있습니다.이를 CSS에서는 단계적 적용이라고 부릅니다. 각 선택자에 점수가 존재하고, 높은 점수의 선택자가 우선시되며, 같은 점수의 선택자라면 나중에 나온 선택자가 우선시 되는 방식입니다.이때 단계적 적용의 순서를 정하기 위한 ..
기본 선택자전체 선택자See the Pen Untitled by onCloud (@onCloudzz) on CodePen.HTML에서 사용 가능한 모든 요소를 한 번에 선택자로 지정하는 방법입니다.태그 선택자See the Pen Untitled by onCloud (@onCloudzz) on CodePen.HTML 태그명으로 선택자를 지정하는 방법입니다.아이디 선택자See the Pen Untitled by onCloud (@onCloudzz) on CodePen.태그에 아이디를 지정해 선택자로 사용하는 방법입니다.아이디명 앞에 # 을 붙이면 됩니다.클래스 선택자See the Pen Untitled by onCloud (@onCloudzz) on CodePen.태그에 클래스를 지정해 선택자로 사용..
웹 개발을 이제 막 시작하고 나서적당히 로직 연습도 되고 디자인도 적당히 되는 그런 주제를 고민하다 나온 주제다. Pomodoro(뽀모도로?)라고 부르는 이 친구는 이탈리아의 프란체스코 치릴로 라는 경영 컨설턴트가 제안한 방법론이다. 꽤 유명한 시간 관리 방법론인데, 25분의 작업 시간과 5분의 휴식시간으로 이루어져 있고이를 작업이 끝날 때 까지 계속 반복하는 것이다. 이 방법대로 하면 작업시간에 높은 집중력을 유지할 수 있어서자주 쉬는 것 같지만 전체 작업시간이 단축되는 효과를 볼 수 있다. 기능 자체가 많지 않고 단순히 25분과 5분 타이머를 무한 반복하고 이를 세는 프로그램이다. 일단 기능 정리부터 해보았다.큰 프로젝트라면 노션에 표라도 만들어서 그럴듯하게 적어야 하지만그냥 작은 기능 하나이기에 메..
본격적인 프로젝트라고 하기엔 민망한 기능들 만드는 과정을 올릴 예정입니다. 그냥 생각나는거 만들때 올릴거라 다른 카테고리보다 슈퍼 랜덤일 예정입니다.
CSS 문법 형식H1 { color : red;} HTML의 태그(예를 들면 h1, p, form, div)나 class, id 속성등을 선택하는 선택자그리고 중괄호 내부의 선언부로 이루어진다. CSS 적용 방법1. 내부 스타일 시트 사용하기HTML 파일 내에 CSS 코드를 적는 방법으로,HTML이 지원하는 태그 중 예시:See the Pen Untitled by onCloud (@onCloudzz) on CodePen. 2. 외부 스타일 시트 사용하기HTML 문서 내에 작성하다보면 CSS 부분의 길이가 길어지는 경우가 생길 수 있습니다.그렇게 되면, HTML 문서의 가독성이 떨어지는 경우가 생겨 문제가 발생합니다.그래서 태그에 스타일 시트 파일을 연결해 외부 파일에서 CSS를 작업하는 방법을 ..
텍스트 작성하기See the Pen Untitled by onCloud (@onCloudzz) on CodePen.제목이나 주제를 나타내는 텍스트를 위한 태그로 중요도에 따라 크기와 굵기가 줄어듭니다.또한, 검색엔진에서 키워드로 인식하는 태그이므로 핵심 내용을 잘 선택해야 합니다. See the Pen Untitled by onCloud (@onCloudzz) on CodePen.본문을 작성할 때 사용하는 태그입니다.사진과 같이 빈태그로 사용해도 같은 효과를 냅니다. See the Pen Untitled by onCloud (@onCloudzz) on CodePen.문단 줄바뀜을 위해 사용하는 태그입니다. See the Pen Untitled by onCloud (@onCloudzz) on Cod..
나의 첫 번쨰 웹 페이지DTD웹 브라우저가 처리할 HTML 문서가 어떤 문서 형식을 따라야 하는 지 알려주는 것위와 같이 작성하면 HTML5 문서 형식으로 인식함.html 태그HTML 문서의 시작과 끝을 정의head 태그HTML 문서의 메타데이터를 정의 메타데이터?HTML 문서에 대한 정보meta 태그메타 데이터를 정의하는 데 사용 이 코드는 HTML 에서 허용하는 문자 집합을 정의함title 태그HTML 문서의 제목을 정의하는 데 사용 (검색 되는데에는 중복되지 않은 제목이 중요함)body 태그웹 브라우저에 노출되는 내용을 작성하는 영역HTML의 특징 파악하기블록 요소와 인라인 요소 처럼 사용 시 자동 줄바꿈이 되는 요소는블록 요소 처럼 사용 시 줄바꿈이 안되는 요소는인라인 요소부모, 자식, 형제 관..