css340 1.8 모든 요소(Element)를 포함하는 선택자(Selector) 구성과 규칙(Rule) 만들기 1.8 모든 요소(Element)를 포함하는 선택자(Selector) 구성과 규칙(Rule) 만들기 * 기호를 이용하여 모든 요소들을 선택하도록 하는 선택자로 구성하고 모든 요소들에 스타일을 적용하는 규칙을 다음과 같은 형식으로 만들 수 있습니다. *{ property:value; property:value; …} 메모장을 열어서 다음과 같이 코드를 작성합니다. 프로그래밍 언어 Java C# Objective-C 만들고자 하는 프로그램에 적합한 것을 선택하라 “universalEx.html”로 저장하고 IE9로 열어보면 다음과 같이 … 블록 내의 모든 요소에 대해서 글자색이 빨강색(red)로 적용되어 나타납니다. - 본 저작물은 본인이 2011년 상반기부터 2012년 여름 즈음까지 도서 출판을 목적으로 .. 2013. 8. 1. 1.7.4 일반적인 형제(General Sibling) combinator 1.7.4 일반적인 형제(General Sibling) combinator 일반적인 형제 combinator는 selector1과 selector2 사이에 물결문자(tilde)가 오며 반드시 selector1이 온 다음에 selector2가 나타나야 하고 같은 부모를 가져야 합니다. 사용형식은 다음과 같습니다. selector1 ~ selector2 { property:value; property:value; …} “combinatorEx.html” 파일을 메모장으로 열고 블록을 다음과 같이 작성합니다. 작성한 후 다른 이름으로 저장을 선택하여 gen_sibling_combinator.html으로 저장합니다. IE9를 통해 열어보면 다음과 같이 최초 h4 요소가 나타난 후 앞서 트리 구조에서 나타난 것처.. 2013. 8. 1. 1.7.3 인접 형제(Adjacent Sibling) combinator 1.7.3 인접 형제(Adjacent Sibling) combinator 인접 형제 combinator는 선택자1(selector1)이 온 다음에 그 다음 바로 나오는 selector2가 나와야 하며 같은 부모를 가져야 합니다. 그래서 이와 같은 조건에 맞는 selector2에 정의된 스타일을 적용하는 것으로 다음과 같은 형식을 사용합니다. selector1 + selector2 { property:value; property:value; …} “combinatorEx.html” 파일을 메모장으로 열고 블록을 다음과 같이 작성합니다. 다른 이름으로 저장을 선택하여 adjacent_sibling_combinator.html로 저장한 후 IE9를 통해 열어보면 다음과 같이 h4 요소 다음에 바로 이어지는 p.. 2013. 8. 1. only-child, only-of-type, empty only-child, only-of-type, empty 메모장으로 “structural-others.html”을 열고 …안의 다음 라인에 아래와 같이 코드를 추가합니다. CSS3 CSS3는 생각보다 재미있습니다. CSS3는 생각보다 재미있습니다. 위와 같이 p 요소의 자식 요소로 em 요소 1개가 사용되는 형태의 p 요소와 em 요소가 2개가 사용된 p 요소가 정의되어 있습니다. 저장한 후 IE9를 통해 보면 다음과 같이 나타나게 됩니다. 이제 only-child 의사 클래스를 이용해서 선택된 요소에 배경색을 청록색(aqua)로 적용해봅니다. 이를 위해 블록 내에 다음과 같이 한 줄을 추가하고 저장합니다. em:only-child{background-color: aqua;} IE9를 통해서 확인하면 다.. 2013. 8. 1. 이전 1 ··· 3 4 5 6 7 8 9 10 다음