Hello, I'm Ming.

CSS란? 기본문법, 박스모델, Float 본문

Coding/웹 애플리케이션

CSS란? 기본문법, 박스모델, Float

#ming 2017. 6. 15. 15:47


1. CSS란?
 Cascading Style Sheet
웹 페이지 디자인을 위한 언어 
2. 탄생 과정
HTML 언어 안에 디자인을 위한 언어가 있었으나
HTML은 정보에만 집중하기 위해
디자인 부분은 따로 만들어 독립적인 CSS라고 부름

3. CSS의 기본 문법


<Style> Tag : CSS 시작을 알리는 태그로 그 태그 사이는 css 언어로 해석 및 적용
h1 {color:red}
h1부분 -선택자(selector)  {color:red} -서술(description)
h1의 이름을 가진 tag의 color를 red로 해라

3. CSS 심화


1) 
<style> 
  h1,h2 {color:red; font-size:50px} 
h1, h2 해당하는 태그 둘다 스타일 변화 주고 싶을 때는 , 콤마로 

  h2 {text-decoration: underline;} 
 
header h1 {border: 1px solid red;} 
header 속 h1 태그만 변화 주고 싶을 때는 selector 를 이어서 

2) {서술 부분}
서술 부분에 한 개 이상의 속성을 추가 할 수 있고
속성간의 구분은 ; 세미콜론으로 한다. 




4. 박스모델
글자에만 테두리 주고 싶다면 



4. 박스모델
글자에만 테두리 주고 싶다면 

사진과 글 모두 한 줄씩 공평하게 할당되어 빈 공간이 생겼다.

CSS의 Float를 사용해 빈 공간을 메웠다.


생활코딩 코딩야학 3일차 


Comments