다룽이네 다락방

CSS 글자 크기 설정 font-size는 글자 크기를 설정하는 요소이다. ex) 글자크기 30px font-size: 30px;

CSS 텍스트 대소문자 설정 text-transform은 텍스트의 대소문자를 설정하는 요소이다. ex) /* 앞글자 대문자로 바꾸기*/ text-transform: capitalize; /* 전부 대문자로 바꾸기*/ text-transform: uppercase; /* 전부 소문자로 바꾸기*/ text-transform: lowercase;

CSS 텍스트 정렬 text-align은 텍스트의 정렬을 설정하는 요소이다. ex) /* 가운데 정렬*/ text-align: center; /* 왼쪽으로 정렬 */ text-align: left; /* 오른쪽으로 정렬*/ text-align: right

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 우선순위를 알아보자 기본적으로 css속성은 위에서부터 아래로 적용 (=밑에 있는게 우선순위가 더 높다) 같은 태그에 여러개의 css속성이 설정된 경우에는 우선순위에 따라 스타일이 적용 !important > 인라인스타일 > 아이디선택자 > 클래스선택자 > 태그선택자 - 위에서 아래로 내려가며 중복된 속성이 있는 경우 !important > 인라인스타일 > 아이디선택자 > 클래스선택자 > 태그선택자 의 우선순위를 가지고 적용된다. (중복값 없으면 당연히 그대로 유지됨) !important / 인라인스타일 별로 사용할일 없긴함

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 그룹 선택자 -여러 요소를 선택해서 각각 같은 요소를 적용 (=여러 태그들 묶어서 같은 스타일 적용하자) ex) 안녕하세요 HI HELLO BYE /* 그룹 선택자 */ p,pre,strong{ color: lime; } 해석 html에 각기 다른 요소들이 있음 그 중 p, pre, strong을 한번에 묶어서 선택하여 글자색 lime을 적용

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 하위 선택자 -특정 요소 하위의 요소를 선택 하위에 있는 모든 요소가 선택된다는 점에서 자식 선택자와 구별된다 (자식선택자는 부모 바로 밑에 있을때만 선택 됨) ex) HI HELLO 안녕 /* 하위 선택자 */ div span{ background-color: yellow; } 해석 div요소 하위에 있는 모든 span태그에 배경 yellow적용 -> 'HELLO'와 '안녕'까지 전부 선택됨

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 종속 선택자 -타입 선택자와 id선택자(#) class선택자(.)가 혼합된 형태 ex) /* 종속 선택자 */ 1. li.acls01{ background-color: green; } 2. li.acls02#sidli{ font-size: 40px; } 해석 1. 태그의 종속클래스인 acls01을 선택하여 배경 green 적용 2. 태그의 종속클래스인 acls02의 id값 sidli를 선택하여 폰트 크기 40px 적용

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 가상클래스 선택자 -특정 이벤트가 발생되면 이를 감지하고 선택하는 태그 이건 코드보고 이해하는게 더 빠르다 ex) html 구글 다음 체크박스 css 1. a:link{ color: pink; } 2. a:visited{ color: grey; } 3. a:hover{ background-color: purple; } 4. input:checked{ width: 200px; height: 200px; } 해석 html? 링크걸린 구글 / 링크걸린 다음 / 체크박스 세가지가 리스트 되어 있음 css? 1. 링크 걸린 곳이 있으면(이벤트 발생하면) 링크 선택하여 글자 pink 2. 링크된 사이..

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 속성 선택자 -속성이 정의된 태그만 선택하는 선택자 머선뜻29? 라고 정의된 태그를 태그1[속성1]{ } 로 표현하여 꾸미기 가넝한 ex) 를 p[title]로 선택할 수 있다. /* 속성 선택자 */ 1. p[title]{ color: skyblue; } 2. p[title="b"]{ background-color: yellow; } 해석 1. title이라는 속성이 정의된 p태그를 선택하여 글자색을 skyblue로 지정 2. title을 b라고 정의한 속성을 가진 p태그를 선택하여 배경을 yellow로 지정 ->1은 title속성 가진 p태그 전체에 적용되겠고, 2는 title속성을 가..

css에서 가장 기본이 되고 중요한 selector(선택자) 선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자 인접 선택자 -지정한 요소 다음에 나오는(인접해 있는) 요소 선택 ex) 태그1 +태그2 { } : 태그1에 인접한 태그2를 선택 h3 + b{ background-color: black; color: white; } : h3 다음에 있는 b태그의 배경을 black, 글자를 white로 지정하겠다.