TIL(Today I Learned) 20210303

@notepad_jj2

츄르사려고 코딩하는 코집사입니다.

---

1. HTML에서 margin과 padding은 약 5px정도가 default라 0으로 설정

* {
  	margin: 0;
 	padding: 0;
}

 

2. box-shadow

/* box-shadow: x-position y-position blur(그림자를 흐릿하게) spread(그림자 확장(양수), 축소) color */
 box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.3);

 

3. positioning

- 아래의 코드에서는 bottom이 0에서 양수로 커질 경우 가운데로 들어가고, right가 0에서 양수로 커질 경우 가운데로 간다.

- 즉, 양수는 중앙으로 가까워지고, 음수는 바깥으로 멀어진다.

- 아래의 코드는 오른쪽 아래에 위치한다.

.menu {
  			position: absolute;
  			bottom: 0;
  			right: 0;
}

 

4. float

- li들이 1행으로 쭉 나열. -> float : left로 했기 때문에

.menu > li {
  			float: left;
  			margin-left: 10px;
  			font-size: 20px;
}

 

5. HTML/CSS margin 순서

- 시계방향 (top, right, bottom, left)