CSS 기초 이론, 셀렉터, 연습

📌 CSS 는 무엇일까?

CSS : Cascading Style Sheet
웹 페이지에 스타일과 레이아웃을 적용할 때 사용한다.

selectors { propertyt: value;}

✏️ CSS 연습

Universal > 모든 태그
* {color: green;}

Type > 태그의 이름
li {color: blue;}

ID > #id(해당하는 id만 골라낼 수 있음)
#special {color: pink;}
li#special {color: pink;}

Class > .class
.red {width: 100px; 
      height: 100px; 
      background: yellow;}

State > :
button:hover {color: red;
              background: beige;}

Attribute > []
a[href="naver.com"] {color: purple;}
a[href^="naver.com"] {color: purple;}
a[href$=".com"] {color: purple;}

padding > content안에 들어가는 spacing 
margin > content밖에 들어가는 spacing 
border > 윤곽선

.red {width: 100px; 
      height: 100px;
      padding: 20px 20px 20px 20px;
      margin: 20px;
      border-with: 2px solid pink;
      background: yellow;}

💎 참조 사이트

https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Selectors
https://flukeout.github.io/