본문 바로가기

css340

1.3 class를 이용한 선택자(Selector) 구성과 규칙(Rule) 만들기 1.3 class를 이용한 선택자(Selector) 구성과 규칙(Rule) 만들기 class를 이용한 선택자를 구성한다는 것은 class 속성을 가지고 있는 요소들 중에서 class 속성값이 일치하는 요소(들)에 대해서 스타일을 적용하는 것으로 다음과 같은 형식을 이용하게 됩니다. .class이름 { property:value; property:value; …} 메모장을 실행하여 다음과 같이 코드를 작성합니다. HTML5,CSS and Javascript HTML5,CSS and Javascript HTML5,CSS and Javascript 위와 같이 작성하고 “classEx.html”로 저장합니다. 그 다음 IE9를 통해 확인해보면 다음과 같이 나타납니다. 이제 class 속성을 이용하여 스타일을 적.. 2013. 7. 31.
1.2 id를 이용한 선택자(Selector) 구성과 규칙(Rule) 만들기 1.2 id를 이용한 선택자(Selector) 구성과 규칙(Rule) 만들기 id를 이용한 선택자는 요소(element) 가운데 id 속성을 가진 요소들 중 해당 속성값과 일치하는 요소들에 스타일을 적용하기 위해서 id를 선택자로 설정해주는 것으로 다음과 같은 형식으로 사용할 수 있습니다. #id이름 { property:value; property:value; …} 실제 예제를 가지고 그 사용방법을 알아볼까요? 메모장을 실행하여 다음과 같이 코드를 작성합니다. HTML5,CSS and Javascript HTML5,CSS and Javascript 위와 같이 h1 요소 2개를 이용하여 “HTML5, CSS and Javascript”라는 텍스트를 화면에 나타내도록 코드를 작성하는데 2개의 h1 요소 중 .. 2013. 7. 31.
1. CSS의 구조와 선택자(selector) 1. CSS의 구조와 선택자(selector) 하나의 스타일 시트(Style Sheet)는 스타일 규칙(Rule)로 구성되며 각 규칙은 다시 선택자(selector)와 속성(property) 그리고 속성값(value)의 조합으로 구성됩니다. 이를 이해를 돕기 위해서 시각화하면 다음과 같이 하나의 규칙(Rule)은 selector, property, value와 같은 부분으로 구성됩니다. 선택자(selector)는 CSS 규칙이 적용되는 대상을 나타내는 것으로 id, class 등과 같은 조건에 의해서 선택된 HTML5의 HTML 요소를 나타냅니다. 속성(property)는 선택자에 속한 글꼴 크기(font-size)와 같은 하나의 속성을 나타내며 속성값(value)은 선택자에 속한 글꼴 크기(font-s.. 2013. 7. 31.
CSS(Cascading Style Sheets) CSS(Cascading Style Sheets) CSS(Cascading Style Sheets)는 하나의 프로그램 언어라고 볼 수 있습니다. 여러분이 이 책에서 배우는 HTML5이나 HTML, XHTML 과 같은 마크업 언어 내로 쓰여진 문서 내 요소들의 모양에 변화를 줄 수 있는 언어입니다. 다시 말해서 CSS를 이용하여 문서 내의 텍스트의 색상, 글자의 크기나 어떤 글자체를 사용할 것인지 그리고 문단 간의 공백은 어느 정도로 하며 배경 이미지나 배경색은 어떤 것으로 할 것인지 등과 같은 다양한 시각적인 효과를 문서에 주고자 할 때 CSS를 사용하게 됩니다. 이러한 CSS는 처음 CSS는 1994년 유럽 입자물리학 연구소(CERN)에 근무하던 Hakon Wium Lie에 의해서 CHSS(Cascad.. 2013. 7. 31.