html box css

box를 꾸미는 3가지 태그를 소개 해드릴게요.

 

border-radius 를 했을때 와 안했을때 의 차이입니다.

다음과 같이

border-radius : npx; 는 n값 만큼 테두리를 둥글게 만드는 태그입니다. 

 

위 사진은 배경색을 입힌건데요

배경색은 background-color : 입력후 위와같이 넣을 색을 입력하시면 됩니다.

 

마지막으로 박스에 그림자를 주는 태그입니다.

box - shadow : px px px color; 로 입력하면 되는데요 여기서 각 픽셀의 값의 의미는

첫번째 px은 가로에 길이 이고 두번째 px은 세로의 길이 그리고 세번째 px은 흐림정도 입니다.

저는 가로길이 40px에 세로길이 10px 흐림정도 10 px에 skyblue 색 그림자를 넣어봤습니다.

 

오늘은 border-radius, background-color 그리고 box-shadow 를 알아봤습니다.