CSS

css? 그리고 작성법

Made Project 2020. 3. 28. 22:20

CSS

cascading style sheets

HTML의 디자인을 입혀주는 스타일시트

 

CSS 적용

 

1. 인라인 스타일:

태그 style 속성에 직접 작성할 수 있습니다.

 

EX

<h1 style="color: red;">FRONTEND 101</h1>

 

 

2. style 태그 

HTML 파일내에 CSS를 작성하는 방법

 

 

EX

   

 

<style>

h2 {

color: #408090;

}

</style>

 

3.CSS 파일에 작성

 

CSS파일을 따로 작성해서 적용하는 방법

 

EX

 

  <link href="index.css" rel="stylesheet" type="text/css" />

 

 

 CSS 구조

 

   제일먼저 선택자 지정을 하고

 

  

왼쪽의 color는 property(속성)이라고 합니다.

Red는 속성값입니다. 

selector는 여러 종류가 올수 있습니다.  ( class,id,tag )

 

tag: 태그이름

p {

font-size: 12px;

}

class: .클래스이름 

클래스에 디자인을 적용하고 싶을 때는 selector에 .(dot)이 필요합니다.

 

.profile-detail { 

font-weight: bold; 

} 

 

id: #아이디이름

#profile {

border-width: 1px;

border-color: black;

border-style: solid;

text-align: center;

}