본문 바로가기

WEB/CSS

(2)
계단식 및 상속 CSS는 Cascading Style Sheet의 약자다. 이름에서도 알 수 있듯이, CSS에서 cascading은 매우 중요하다. 계단식(cascade)과 우선순위(specificity), 상속(inheritence) 개념에 대해 알아보자 계단식(cascade) CSS에서 동일한 우선순위를 가지는 서로 다른 규칙들이 적용된다면, 마지막에 나오는 규칙이 사용된다. h1{ color: purple; } h1{ color: magenta; } h1{ color: pink; } 위와 같은 코드에서 h1은 핑크색이 된다. 우선 순위(Specificity) 동일한 요소에 대한 여러 규칙에 다른 선택자가 있는 경우, 브라우저가 어떤 규칙을 적용하는지 정하는 방법이다. 일반적으로 선택자의 선택이 구체적일수록 우선순위..
CSS 시작하기 일단 스타일을 적용하기 위한 HTML문서를 만들자. CSS를 사용하기 위해서는 HTML문서에 CSS규칙을 사용하려 한다는 것을 알려야 한다. 적용 방법에는 여러 가지가 있지만, head에서 연결하는 방법이 가장 일반적이고 유용하다. HTML문서와 같은 폴더에 파일을 만들고, styles.css라고 저장한다. styles.css파일을 링크하기 위해서 HTML문서의 안에 다음을 추가한다. HTML 요소 스타일링 요소이름1, 요소이름2 { 속성: 값; 속성: 값; } 위와 같은 형식으로 써주면 된다. 요소의 기본 동작 변경 HTML에서는 요소마다 기본으로 적용되는 서식이 있다. 하지만 이를 원하지 않을 수도 있다. 그럴 경우, 변경하려는 HTML 요소를 선택해서 CSS 규칙으로 변경해주면 된다. 예를 들어서,..