일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- css
- not 의사클래스
- 일반 형제 결합자
- focus 의사클래스
- background-color 속성
- id 선택자
- reveal in file explorer
- 인접 형제 결합자
- iframe
- html 태그
- padding 속성
- Live Server
- iframe 태그
- go live
- Checked 의사 클래스
- tag html
- width속성
- html tag i
- html
- 임베디드
- i 태그
- br 태그
- 전체 선택자
- RGB
- RGBA
- 아두이노
- 자식결합자
- sup태그
- sub태그
- height속성
- Today
- Total
목록css (9)
so woon!

학습일 : 2022. 09. 07 padding 속성 요소의 내부 여백을 지정하기 위해 사용한다. 용법 (한 개) ... { padding: [?px|?rem|?%|...]; } 선택된 요소의 모든 방향에 대한 내부 여백을 지정한다. 퍼센트(%)값은 해당 요소를 포함하는 부모 요소의 크기에 대한 백분율이다. 용법 (두 개) ... { padding: [상/하 : ?px|?rem|?%|...] [좌/우 : ?px|?rem|?%|...]; } 선택된 요소의 상/하 및 좌/우 내부 여백을 각각 지정한다. 용법 (네 개) ... { padding: [상 : ?px|?rem|?%|...] [우 : ?px|?rem|?%|...] [하 : ?px|?rem|?%|...] [좌 : ?px|?rem|?%|...]; } 선..
학습일 : 2022. 09. 05 Checked 의사 클래스 Checked 의사 클래스(Pseudo Class)는 어떠한 선택자에 의해 선택된 요소가 체크 되어 있는 상태에 대한 선택자이다. 주로 type이 checkbox인 input을 위해 사용한다. 다음과 같이 작성한다. ("는 없는 것으로 한다.) "선택자":checked { "속성" : "속성 값"; "속성" : "속성 값"; "속성" : "속성 값"; } ❤ ==============실행결과=============

학습일 : 2022. 09. 05 width 및 height 속성 width는 가로크기를, height는 세로크기를 지정하기 위해 사용한다. 단, display가 inline인 요소(span, a 등)는 그 display 값을 다른 것으로 변경하기 전에는 width 및 height 속성이 적용되지 않는다. ============실행결과==============

학습일 : 2022. 09. 05 background-color 속성 background-color 속성(Property)은 선택한 요소의 배경 색상을 지정하기 위해 사용한다. background-color : black; ==========실행결과========== background-color : #000000ff; ===========실행결과============== background-color : rgba(0, 0, 0, 50%); ==============실행결과============= background-color : rgb(0, 0, 0); =============실행결과=============

학습일 : 2022. 09. 05 인접 형제 결합자 인접 형제 결합자(Adjacent Sibiling Combinator)는 어떠한 선택자에 대한 인접한 형제를 선택하기 위해 사용하는 결합자이다. 다음과 같이 작성한다. ("는 없는 것으로 한다.) "어떠한 선택자" + "형제 선택자" { "속성" : "속성 값"; "속성" : "속성 값"; "속성" : "속성 값"; } 아래 조건을 만족하는 경우 선택된다. 1. 위 작성 예시에서 "어떠한 선택자"와 "형제 선택자"는 같은 부모를 가져야한다. 2. 위 작성 예시에서 "형제 선택자"는 "어떠한 선택자" 바로 뒤에 와야한다. 주의 사항 1. 어쩌고 2. 저쩌고❤ 3. 그렇고 참고 사항 - 어쩌고❤ - 저쩌고 - 그렇고 ============실행결과======..

학습일 : 2022. 09. 05 일반 형제 결합자 일반 형제 결합자(General Sibiling Combinator)는 어떠한 선택자에 대한 형제를 선택하기 위해 사용하는 결합자이다. 다음과 같이 작성한다. ("는 없는 것으로 한다.) "어떠한 선택자" ~ "형제 선택자" { "속성" : "속성 값"; "속성" : "속성 값"; "속성" : "속성 값"; } 아래 조건을 만족하는 경우 선택된다. 1. 위 작성 예시에서 "어떠한 선택자"와 "형제 선택자"는 같은 부모를 가져야한다. 2. 위 작성 예시에서 "어떠한 선택자"보다 "형제 선택자"는 뒤에 와야한다. 주의 사항 1. 어쩌고 2. 저쩌고 3. 그렇고 참고 사항 - 어쩌고❤ - 저쩌고❤ - 그렇고❤ =================실행결과======..

학습일 : 2022. 09. 05 자식 결합자 (Child Combinator) 자식 결합자는 어떠한 부모 선택자에 대한 자식을 선택하기 위해 사용하는 결합자이다. 다음과 같이 작성한다. ("는 없는 것으로 한다.) "어떠한 부모 선택자" > "자식 선택자" { "속성" : "속성 값"; "속성" : "속성 값"; "속성" : "속성 값"; } Hi!❤ 내가 빨간색임❤ ===========실행결과=============

학습일 : 2022. 09. 05 이 내용 공부 전 (자식 선택자) 먼저 보고 다시 오세요! 전체 선택자 (Universal Selector) 전체 선택자는 주로 모든 요소를 선택할 때 사용한다. 다음과 같이 작성한다. * { 속성 : 속성 값; 속성 : 속성 값; 속성 : 속성 값; } 나는 노터치 a도 바뀌고 b도 바뀌고 i도 바뀌고 strong도 바뀌고 u도 바뀌고 ==============실행결과============