자바를 자바

position : 절대위치와 상대위치 기준이 되는 요소에 position : relative; 이동시킬 요소 position : absolute; 이동시킬 요소에 얼만큼 이동시킬건지 명시; z-index : 페이지 안의 요소들을 순서대로 위로 쌓는 속성 * 특징 - 값이 높을수록 위에 쌓인다. - 값의 크기는 상관이 없다. visibility : 페이지 특정 요소들을 보이거나 보이지 않게 하는 속성 float : 페이지 내의 요소들을 화면으로부터 띄워서 왼쪽 또는 오른쪽으로 배치하는 속성 float 사용후엔 반드시 해제를 해줘야 다음 컨텐츠가 제대로 출력된다. ※ 해제를 해주지 않는다면.. 그다음에 나올 요소들도 float가 적용되어서 둥둥 뜨게 된다.

width, height : content 영역의 크기를 조절하는 속성 display : 화면 배치 방법 변경, 블럭요소와 인라인요소의 속성을 변경해서 배치 방식을 변경 1. 블럭요소 => 인라인요소 2. 위에서 인라인요소로 바꾼것을 width, height속성 유지시키기 3. 기존의 인라인요소를 블럭요소로 바꾸기

background-color / background : 배경색을 지정하고자 할 때 사용 background-clip : 배경을 적용시키고자 하는 범위를 지정할 때 사용 배경으로 이미지 설정하기

영역 구분(바깡쪽에서 안쪽 순서) margin : 바깥쪽 여백 영역 border : 테두리 영역 => 여기까지가 실제 요소의 크기 padding : 내용물영역이랑 테두리 영역 사이의 거리(안쪽여백) content : 실제 내용물이 들어있는 영역 => 실제요소의 크기(영역) == content + padding + border padding 내용물 영역(content)와 테두리 영역(border) 사이의 거리(여백)을조절하는 스타일 속성 margin 타 요소들 사이의 간격을 조정할 때 사용 실제 영역에는 포함이 안되므로 실제 요소 크기에 영향을 미치지 않는다.

list-style-type : 불릿 기호를 바꿀 때 사용 list-style-position : 불릿기호의 위치조정할 때 사용 list-style-iamge : 불릿기호로 이미지를 적용할 때 사용

text-decoration : 텍스트에 줄을 긋거나 없앨 때 사용 text-align : 텍스트를 정렬할 때 사용

글꼴 관련 스타일 font-family : 글꼴을 지정할 때 사용 font-size : 크기에 해당되는 숫자(단위: px/em/%) - 웹사이트에서 폰트 가져오는 방법 font-weight : 글꼴의 굵기를 표현할 때 사용 font-style : 텍스트문구를 기울이고자 할 때 사용

1. 속성 선택자 스타일을 부여하고자 하는 요소 내에 작성되어있는 속성을 이용해서 선택하는 방법 기본선택자 뒤에 []를 이용해서 속성과 속성값을 제시해서 선택하는 방법 2. 자손선택자와 후손선택자 자손 : 바로 하위 요소들 후손 : 하위 요소들 전부 3. 동위(같은레벨) 선택자 동위 관계(같은 레벨) 선택자 4. 반응 선택자 마우스의 반응에 따른 속성을 설정 할 수 있다. 5. 상태 선택자 요소의 상태에 따라서 선택되는 선택자 선택할 수 있는 상태의 종류 checked 상태 focus 상태 enabled 상태 disabled 상태 - 선택자 우선순위 기본적으로 css는 스타일이 위에서 아래 순으로 적용됨 동일한 요소를 다양한 선택자로 css가 부여된 경우 우선순위에 다라 적용된다. *선택자 우선순위(높은..

CSS(Cascading Style Sheets) HTML 구조는 그대로 두고 style태그로 구조를 꾸미는 역할을 하는 표현언어 HTML과 마찬가지로 웹 표준이며, CSS3버전까지 존재하고 보통은 3버전을 사용한다. 웹표준 : W3C (WWW Consortium)에서 지장 - CSS 스타일 부여 방식 인라인 스타일 방식 : 스타일을 부여하고자 하는 요소 내에 style속성을 사용해서 직접 기입하는 방식 내부 스타일 방식 : 현재 이 html문서에 적용시키고자 하는 스타일 정보들을 영역에 태그 내에 기입하는 방식 외부 스타일 방식 : 스타일정보만을 따로 관리하는 .css 외부 문서를 만들고 태그를 통해 연결시켜주는 방법 -선택자란? 특정 html요소를 선택하고자 할 때 사용하는 기능 1. 모든(전체) 선..