3일차 NCS소개 페이지 만들기

 

태그 : 명령어

 

선택자 : 태그를 지정하는 옵션

선택자 종류 : class, tag

block 요소 : 한 줄에 하나의 태그만 온다. (div, p, ul)

inline 요소 : 한 줄에 여러 개의 태그가 온다. (span, img )

 

color 글자 색깔

font-size 글자 크기 1rem=16px

text-align:center 가로로 중앙에 놓는다

line-height: 세로로 중앙에 놓고 싶을때 height와 크기를 똑같이 넣으면 된다.

text-indent 텍스트 들여쓰기

 

<link rel="stylesheet" href="css/index.css"> 외부스타일

div.box$*3 엔터를 누르면 <div class="box1"></div> ... <div class="box3"></div> 생성

 

float : 배치(정렬) 하는 명령어

span : 글자 태그 .(점) 안붙임

 

display: 화면 배치 방법

display: "none"; // 배치하지 않겠다. (안 보이게 하겠다)

display: "block"; // 배치하겠다. (보이게 하겠다) 블록요소로 보이게 하겠다.

display: "flex"; // 배치하겠다. (강제로 옆으로) 인라인요소 형태로 보이게 하겠다.

 

자바스크립트 선언

<script></script>

 

justify-content:space-evenly; 아이템들의 사이와 양 끝 간격을 똑같이 배치한다.

flex-wrap:wrap 칸이 꽉 차면 줄 바꾸기

 

그림을 딱 맞게 맞추고 싶을 때

width:100%

그림을 가로 중앙으로 맞추고 싶을 때 : 부모태그에서 text-aline:center;

그림을 세로 중앙으로 맞추고 싶을 때 : 본인 태그에서 margin-top 숫자 부여하기

 

 

NCS소개

NCS소개