미미 코딩

position ⇒ 원하는 위치에 배치하기 요소의 위치를 정하는 속성이며, 속성값은 static, relative, absolute, fixed 이 있다. static position의 Default 값이다. 위 → 아래 , 좌→ 우로 차례대로 요소를 배치하는 속성값이다. relative 원래 배치되어야 할 위치에서 지정한 만큼 떨어진 곳에 요소를 배치한다. absolute 부모 중에 static이 아닌 요소의 위치를 기준으로 지정한 값만큼 떨어진 곳에 요소를 배치한다 fixed 웹브라우저 화면 전체를 기준으로 배치한다. 스크롤 하더라도 위치가 고정된다. display ⇒ 배치방식 변경하기 display 속성을 이용하면 inline, block 을 바꿀 수 있다. 특히 inline-block 으로 선언하..

선택자 특정한 요소에 스타일을 지정할 수 있게 원하는 요소를 선택하기 위한 방법이다. 전체, 태그, 클래스, 아이디, 속성을 이용하여 원하는 요소를 선택하여 스타일을 적용시킬 수 있다. 동일한 요소에 대해 여러 개의 스타일한 경우 우선순위가 높은 선택자의 스타일이 적용된다. ➡️ 우선 순위 : 전체 < 태그 < 클래스 < 아이디 ⇒ 선택할 범위가 좁을수록 우선 순위가 높다!! 기본 선택자 전체 선택자 : 모든 태그를 선택하며, ' * ' 로 표시한다. *{color : red;} 태그 선택자 h1{color : blue;} 클래스 선택자 : 특정 class를 선택할 수 있으며, 클래스명 앞에 '.' 를 붙여 선택한다. .title{color : green;} 아이디 선택자 : 특정 id를 선택할 수 있으..

01.Text Tag : 제목, 글자크기, 중요도 순으로 h1 → h6 : 단락, 문단, 절 : 줄바꿈 : bold 처리 : bold 처리 (웹접근성 측면에서 태그보다 더 좋음) : 자기 글자만큼만 영역 확보 : 하이라이트 효과 : 단락 구분, 문서의 구분선 : 짧은 인용문구, 자동으로 쌍따옴표를 넣어준다 : 긴 문구를 인용할 때 사용 : 작성한 그대로 화면에 표시 02. image Tag속성 : 이미지를 표시하기 위해 사용하는 태그 : 사진, 도표, 삽화, 오디오, 비디오… 등을 담는 컨테이너 역할 : figure 요소 안에서 한 번만 사용가능하며, figure의 컨텐츠를 설명하는 문구를 담는 태그 03. List Tag : 순서가 있는 리스트 (번호가 있음) : 순서가 없는 리스트 (번호가 없음) :..

웹표준 웹표준은 웹사이트를 만들 때 지켜야 하는 약속들을 정리한 것이다. 표준을 지켜 웹사이트를 제작하면 운영체제나 브라우저에 상관 없이 사용자에게 동일한 결과를 보이게 하는 것이다. 이것이 웹표준의 궁극적인 목표이다. HTML (Hypertext Markup Language) 웹 브라우저에서 보이는 화면 구조를 만들기 위한 언어이다. HTML로 글자, 이미지 등을 표현할 수 있고, 링크를 통해서 문서 내 또는 다른 사이트로 이동할 수 있다. HTML은 Tag(태그)로 구성되며 태그는 시작태그와 종료태그가 한쌍으로 다닌다. 또한, 시작태그에 속성을 표기할 수 있으며 Tag 그 자체가 컨텐츠에 대한 의미를 지니고 있는데 이것을 시맨틱 태그라 한다. HTML의 기본구조 block 요소 & inline 요소 ..