https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com 기본 상속 구조 HTML 코드 HTML의 구조 HTML의구조입니다. 상속 구조를 위에서 부터 살펴보자 부모: html 자식 : head , body head 자식: tilte body 자식 :h2, p p 의 자식 :b 1.자식 선택자 - 부모의 요소 하위의 자식요소의 스타일을 적용 body>p {color:deepskyblue} 2. 자손..
https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com 그룹 선택자 여러개의 요소를 나열하고 , 로 구분하여 스타일을 적용 h2,p{설정값} h2 와 p 모두 적용 HTML 코드 그룹선택자 여러개의 요소를 나열하고 ,로 구분해 스타일을 적용 선택자의 종류 전체 선택자 요소 선택자 아이디 선택자 클래스 선택자 그룹 선택자 .
https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com class 선택자 -특정 집단의 요소를 한번에 스타일을 적용 -.기호를 사용해서 같은 class 이름을 가진 요소에 스타일을 적용 - 두개이상의 클래스를 적용할 경우 class 안에서 띄어쓰기로 적용 CSS h2{font-size :20px;} 안녕하세요,반갑습니다 적용 h2.hello {color:deeppink;} 안녕하세요 적용 .he..
id 선택자 - 웹 문서안의 특정 부분 스타일을 적용 - #기호를 사용해서 id속성을 가진 요소에 스타일을 적용 - CSS도 덮어쓴다. -> 순서가 중요 CSS h2 {font-size : 30px;} 1. 2. 둘다 적용 h2#hello {font-size :20px;} 1. 20px로 변함 #hello {color :pink}*1. pink 컬러로 적용 HTML 1. 안녕하세요 2. 반갑습니다 HTML 코드 id 선택자 div 첫번째 영역 div 두번째 영역
https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com 상속 1.부모 요소의 속성값이 자식 요소에게 전달되는 것 2.상속되고 상속되지 않는 스타일이 있다. 사이트 참고(inherited) https://www.w3.org/TR/CSS22/propidx.html HTML 코드 상속 div 영역 상속이란 부모 요소의 속성값이 자식 요소에게 전달되는 속성
https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com 요소 선택자 -특정 요소가 쓰인 모든 요소에 스타일을 적용 ✔상속 부모 요소의 속성값이 자식 요소에게 전달되는 것 상속되고 상속되지 않는 스타일이 있다. 사이트 참고(inherited) ✔https://www.w3.org/TR/CSS22/propidx.html Full property table 'cursor' [ [ ,]* [ auto |..
https://coding-diary100.tistory.com/45 CSS_ 기본 개념과 문법 CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 coding-diary100.tistory.com 1. 전체 선택자 -스타일을 모든 요소에 적용 -*기호를 사용해서 표현 -너무 많은 요소가 있는 HTML문서에 사용할 경우 클라이언트에 부하를 줄 수 있음 문법 *{속성명1:속성값1; 속성명2:속성값2;} ✔개별적으로 적용한 스타일은 전체 선택자에 적용한 스타일보다 우선! HTML 코드 전체선택자 스타일을 모든 요소에 적용 *기호를 사용해서..
CSS(Cascading Style Sheet) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 각각 페이지 마다 적용해야 해서 귀찮음 -> 외부스타일을 가장 많이쓴다. 3. 외부 스타일 웹 사이트 전체의 스타일을 하나의 파일에서 변경할 수 있도록 적용하는 방법 ✔ rel 현재 문서와 링크된 문서 사이의 연관관계를 명시
