css12 기타선택자 수업내용 복습 1. 비쥬얼스튜디오코드 프로그램으로 수업내용 복붙2. 미리보기로 활용 복습 속성 선택자 선택하고자 하는 요소에서 작성되어 있는 속성을 이용해서 선택하는 방법 선택자 뒤에 []를 이용해서 속성과 속성값을 제시하여 선택 * 키워드 => 속성값 키워드가 일치하는 경우 : 선택자[속성명=키워드] 키워드가 포함되어 있는 경우 (전체단어) : 선택자[속성명~=키워드] 키워드가 포함되어 있는 경우 : 선택자[속성명*=키워드] 키워드로 시작하는 경우 (전체단어 또는 단어 다음에 -가 있는 경우) : 선택자[속성명|=키워드] 키워드로 시작하는 경우 : 선택자[속성명^=키워드] 키워드.. 2024. 10. 16. 기본 선택자 수업내용 복습 1. 비쥬얼스튜디오코드 프로그램으로 수업내용 복붙2. css 선택자 미리보기로 활용 복습 CSS 기본 선택자 선택자란? 특정 html요소를 선택하고자 할 때 사용하는 기능 해당 요소를 선택해서 원하는 스타일과 기능을 적용시킬 수 있다. 모든(전체) 선택자 : * 현재 이 문서 상에 모든 요소들을 다 선택하고자 할 때 사용 * { 스타일속성: 값; 스타일속성: 값; } 태그 선택자 : 태그명 현재 이 문서 상에 해당 태그를 모두 선택하고자 할 때 사용 태그명 { 스타일속성: 값; } .. 2024. 10. 15. 선택자 우선순위 CSS에서 선택자 우선순위는스타일이 어떻게 적용될지를 결정하는 중요한 개념입니다.선택자의 우선순위는 다음과 같은 규칙에 따라 결정됩니다:1. 인라인 스타일: 요소에 직접 적용된 스타일로, 가장 높은 우선순위를 가집니다. 예: 2. ID 선택자: #로 시작하는 선택자로, 인라인 스타일 다음으로 우선순위가 높습니다. 예: #header { color: blue; }.3. 클래스, 속성, 가상 클래스 선택자: .로 시작하는 클래스 선택자와 .. 2024. 10. 14. CSS 기본 선택자 알아보기 CSS(캐스케이딩 스타일 시트)의 기본 선택자는 HTML 문서에서 스타일을 적용할 요소를 선택하는 방법을 제공합니다. 여기에는 여러 가지 기본 선택자가 있으며, 각각의 선택자는 다양한 HTML 요소를 선택하고 스타일을 적용하는 데 사용됩니다. 주요 기본 선택자는 다음과 같습니다:요소 선택자 (Element Selector)HTML 요소의 이름을 직접 사용하여 해당 요소를 선택합니다.예: p { color: blue; }이 선택자는 모든 요소의 글자 색상을 파란색으로 설정합니다.클래스 선택자 (Class Selector)클래스 속성 값을 기반으로 요소를 선택합니다. 클래스 선택자는 점(.)으로 시작합니다.예: .my-class { font-size: 16px; }이 선택자는 class="my-class".. 2024. 8. 18. 스타일 시트란 ? 스타일 시트 알아보기웹 문서 안에서는 스타일 규칙을 여러 개 사용합니다.이런 스타일 규칙을 한 눈에 확인하고 필요할 때마다 수정하기도 쉽도록 한 군데 묶어 놓은 것을 스타일 시트라고 합니다.스타일 시트는 크게 웹 브라우저에 기본으로 만들어져 있는 브라우저 기본 스타일과사이트 제작자가 만드는 사용자 스타일로 나눌 수 있습니다. 사용자 스타일은 다시 인라인 스타일과 내부 스타일 시트, 외부 스타일 시트로 나뉩니다. 브라우저 기본 스타일CSS를 사용하지 않은 웹 문서라 하더라도 웹 브라우저에 표시할 때는 기본 스타일을 사용하는데,이것을 브라우저 기본 스타일이라고 합니다. 간단한 스타일 정보를 적용하는 인라인 스타일간단한 스타일 정보라면 스타일 시트를 사용하지 않고 스타일을 적용할 대상에 직접 표시합니다.이런 .. 2024. 8. 10. 스타일이란 ? 스타일 형식 알아보기CSS소스에서 한 줄이 하나의 스타일에 해당하고, 조금 더 들여다보면 줄마다 형태가 비슷하다는 걸 알게될 것입니다.CSS스타일의 형식은 다음과 같습니다.기본형 선택자 { 속성1 : 속성값1; 속성2 : 속성값2;} 맨 앞의 선택자는 스타일을 어느 태그에 적용할 것인지 알려주는 것이고,중괄호({ }) 사이에는 스타일 정보를 넣습니다. 속성과 값이 하나의 쌍으로 이루어진 것을 스타일 규칙이라고 하며,세미콜론(;)으로 구분해서 스타일 규칙을 여러 개 지정할 수 있습니다. 예를 들어 텍스트 단락의 글자를 강누데로 정렬하고 글자색을 파랑으로 지정하고 싶다면 다음과 같이 작성합니다.태그에 스타일 적용하기P { text-align : center; color :.. 2024. 8. 9. 이전 1 2 다음