일부 문단은 파란색으로 다른 문단은 빨간색으로 지정하려면 어떻게 할 것인가? 유형으로만 지정하는 것보다는 좀 더 세부적으로 구성요소를 선택할 수 있는 방법이 필요하다. 클래스 구성요소에 클래스 어트리뷰트를 추가하는 것은 간단하다. 첫번째 문단의 코드를 다음과 같이 바꿔라 I love HTML. 이제 우리는 해당 문단에 'red'클래스를 적용했다. 이제 아래 코드를 웹페이지의 스타일 부분에 추가하라. .red { color: red; } 주의 : 'red'앞의 구두점(.)은 브라우저에게 우리가 클래스를 찾고 있다는 것을 말해준다. 구두점은 CSS의 클래스를 이르는 약칭이다. 12345 abc 왼편코드의 결과값 코딩이 해석이 되시나요? red 라는 클래스를 style 안에 만들어 놓고 문장에서 태그를 이용해..

내부 CSS란 무엇인가 내부 CSS는 HTML문서의 시작 부분에 모든 CSS를 모아 놓은 경우를 말한다. 부분을 잘 살펴보면 새로운 구성요소인 이 보인다. css를 담고 있다. 스타일부분의 내용은 다음과 같다 p { color: blue; } 기본적으로 '모든 구성요소를 찾고 텍스트 컬러를 파란색으로 바꿔라'는 내용이다. 중괄호 { 와 } 사이에 p 구성요소에 적용하고 싶은 모든 규칙을 담는다 그리고 세미콜론으로 종결한다. 이제 전체 문단을 파란색에서 녹색으로 바꾸고 싶다면 css만 변경하면 된다. HTML 근처에도 갈 필요도 없다. 내부CSS로 텍스트색 바꾸기 css의 color가 blue 였는데 green으로 바뀌면 텍스트 전체의 색깔이 green으로 바뀌는 것을 볼 수 있다. 이렇게 CSS의 정의를..

HTML이 웹페이지에 들어 가는 여러형태의 구성요소를 만드는 것이라면 CSS는 구성요소의 스타일을 정하는 방법이다. CSS가 무엇이고 어떻게 사용하는지 클래스와 아이디를 사용하여 구성요소를 어떻게 조회하는지 웹페이지를 재구성하기 위해 DIV를 사용하는 법, 테두리와 포지셔닝, 컬러와 폰트, 텍스트와 링크 포맷을 조정하기 위해 CSS를 사용하는 법을 배운다. CSS란 무엇인가 HTML로 웹페이지에 구성요소를 추가할 수는 있지만 이들의 위치, 색깔, 폰트 또는 스타일을 조절하기는 쉽지 않다. 스타일 정보를 페이지 내용과 별도로 저장하여 내용에 영향을 주지 않고 쉽게 스타일을 조정하자는 것이 주된 생각이었다. 실제로 HTML은 전혀 손대지 않고 CSS만 변경하여 웹페이지의 모습과 레이아웃을 바꿀 수 있다. 왜..