CSS 이론2

CSS는 태그 별로 기본 디자인을 가지고 있음

CSS를 통해서 모든 디자인을 바꿀 수 있다.



실습 1 : h1태그의 글자 사이즈를 바꾸고 싶다.

font-size:xxpx 사용

속성과 속성의 구분 => ;
  h1 {
    color:red; 
    font-size:10px
  }



실습 2 : h2태그도 h1태그와 같은 효과를 주고 싶다.

    h1, h2 {
    color:red; 
    font-size:10px
  }



실습 3 : 실습 2의 속성은 유지하고 h2에만 밑줄을 긋고 싶다.

h1, h2 {
  color:red;
  font-size:10px
}
h2 {
   text-decoration:underline;
}



실습 4 : header태그 밑에있는 h1에만 효과를 주고 싶다.

  • <h1>CSS</h1>을 header태그로 감싼 후에 header h1으로 구현 가능

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      h1, h2 {
        color:red;
        font-size:10px
      }
       h2 {
         text-decoration:underline;
      }
      header h1{
        border:1px solid red;
      }
    </style>
  </head>
  <body>
    <header>
      <h1>CSS</h1>
    </header>
    <h2>JavaScript</h2>
    <h3>HTML</h3>
    <h1>PHP</h1>
  </body>
</html>

border => 테두리



'웹 프로그래밍' 카테고리의 다른 글

CSS 이론 - float  (0) 2017.12.17
CSS 이론 - 박스모델  (0) 2017.12.17
CSS 이론1  (0) 2017.12.16
개발도구 - 아톰  (0) 2017.12.16
HTML실습  (0) 2017.12.14

+ Recent posts