[ css ] 속성의 종류

🐾 CSS속성

속성이란? 특정한 성격의 옷을 가진 형태를 말함.

선택자(Selector) { 속성 : 값; }

• < 작성방법 ( 2가지 방법 다 무관 )>

방법1

선택자{ 속성1: 값1; 속성2: 값2 }

방법2

 선택자{
    속성1: 값1;
    속성2: 값2;
  }

---

📝 글자 & 배경 넣어보기

📝 값이란? 특정한 성격에 맞는 표현값을 말함. 속성마다 값은 다양하게 존재

.text {
        color: #595fff; /*글자색상 - 단어,hex(드래그>ctrl+e>색상선택>esc)*/
        font-size: 20px; /*글자사이즈 - [px,em,pt... 단위] */
        font-weight: 900; /*글자의 굵기 - 100~900(100-300가늘게),(400-600중간),(700-900굵게)
            서체마다 굵기가 적용되지 않을 수 있음!*/
        line-height: 50px; /*행간, 줄간격 - [px,em,pt,%... 단위]*/
        font-family: '궁서'; /*글꼴  -  내 컴퓨터에 저장된 글자가 표현(웹폰트는 예외)*/
        font-style: italic; /*글자스타일 - italic,normal*/
        letter-spacing: 10px; /*자간, 글자사이의 간격 - 숫자입력(px,%..)*/
        text-align: left; /*문단 정렬(글자 정렬) - left,right,center*/
      }

    a {
        text-decoration: none; /*<<(a태그에 대한 기본값) 글자를 꾸며주는 속성*/
        /*none : 선을 삭제
            line-through : 글자 중간에 선을 만듭니다.
            overline : 글자 위로 선
            underline : 글자 아래로 선*/
        color: #595fff;
      }

    body {
        background-color: #433bff; /*배경색상*/
        background-image: url(img/bg.png);  /*배경이미지 속성 > url(이미지의 경로)
                 이미지사이즈가 부모의 사이즈보다 작을 때 반복되는 성격 / 공간,내용물이 있는 상태에서 나타남!*/
        background-repeat: no-repeat; /* 배경이미지 반복 속성 > no-repeat(반복되지 않는 원본 한장!)
                 repeat-x(가로반복)  /  repeat-y(세로반복) / repeat(반복,기본값)*/
        background-size: 50%; /*배경이미지 사이즈 속성 - x(가로폭)  y(세로폭) px,%값*/
      }

---

     h1 {
        /*background-color: #f5efe0;*/
      }

      p {
        background-image: url(img/bg.png);
      }

    <h1>배경관련 속성</h1>
  <p>
    배경색을 넣거나 배경이미지를 넣어서 공간을 활용!
    <br />
    배경색을 넣거나 배경이미지를 넣어서 공간을 활용!
    <br />
    배경색을 넣거나 배경이미지를 넣어서 공간을 활용!
    <br />
    배경색을 넣거나 배경이미지를 넣어서 공간을 활용!
    <br />
    배경색을 넣거나 배경이미지를 넣어서 공간을 활용!
    <br />
  </p>

---

🔎 적용하지 않은 요소들이 스타일이 적용될 때는 왜 그런것인가요??

• 상속의 개념
  어떤 속성들은 부모 태그에 특정 값을 적용 시 아래, 즉 하위 요소에도 그 속성들이 그대로 적용됩니다. 예를 들어 정렬(text-align,color,font-size...) 같은 류!
  이러한 개념을 "상속"이 된다고 이야기 할 수 있습니다!

• inherit : 강제로 부모의 속성을 상속하는 값(모든 값에 적용되어짐)