Wecode 2일차 bloging

장운서·2021년 6월 8일
0

위코드 2일차....
어제 빠르게 모두 문제를 풀고 가려고했지만

부업 하다가 남은 게 있어서 7시 30분정도에 집에 갔다.

어제 이후로 css남은 문제를 풀고있다.

1. position 속성 - relative, absolute, fixed

position - relative 는 기준을 잡아주는 속성이다.
top, right, bottom, left 는 position이라는 프로퍼티가 있을 때만 적용되는 프로퍼티 이다.

position - absolute 는 객체를 띄워주는 속성이다.
부모를 기준으로 절대적인 기준치로 움직여주는 속성이다.

position - fixed
브라우저 화면 내에서 고정해주는 속성이다.

2. inline, inline-block, block 에 대해서
대부분의 HTML element(이하 요소)는 block 요소입니다.

예를 들어, <header>, <footer>, <p>, <li>, <table>, <div>, <h1> 등이 모두 block 요소에 해당하는 태그들입니다.

block 요소의 의미는, 이 요소 바로 옆(좌우측)에 다른 요소를 붙여넣을 수 없다는 뜻입니다.

block 요소와 성질이 반대인 inline 요소도 있습니다.

<span>, <a>, <img> 태그 등이 inline 요소입니다.

inline이라는 말 그대로 inline 요소는 요소끼리 서로 한 줄에, 바로 옆에 위치할 수 있다는 뜻입니다.

3. float에 대해서

float은 말 그대로 띄우다 라는 뜻입니다. css에서는 정렬을 하기위해 사용되는 속성입니다.
속성에는 none,left,right,inital,inherit이 있다.
float은 박스의 흐름이 기존과는 다르기 떄문에 부모 요소의 높이에 영향을 주지 않는다.
그래서 float은 항상 clear를 해주어야 한다.

float을 clear해주는 방법 : https://naradesign.github.io/float-clearing.html

에고...요즘엔 float이 아닌 felx로 정렬 한다는 얘기를 스터디 하다가 처음 들었다.

이부분은...공부를 해봐야 할것같다.

profile
방향성을 찾고싶은 프론트엔드개발자

0개의 댓글