궁금했던 CSS와 html을 시작했다. 생각보다 쉬었다 java보단 확실히. 뼈대인 html 위에 CSS로 꾸미는 맥락이 꽤 새로웠다. 전에 들었을땐 '뭐가 다르지?'란 생각을 했는데 강의 들어보니까 차이가 보이기 시작했다. 나쁘지 않은 시작이다!
What I learned:
1. Padding과 Margin의 차이점
Padding은 안쪽으로 여백을 줄 때 쓰는 태그고 Margin은 밖으로 여백을 줄 떄 쓰는 태그다.
/*안쪽으로 20px 여백 줌*/ padding: 20px;
/*centeralize*/ margin: auto;
/*시계방향 - 위, 오, 밑, 왼*/ margin: 0px auto 30px auto;
2. html 파일 안에서 CSS 사용 방법
head 태그 안에 style 이라는 태그를 만들고 CSS 코드를 style로 만들어진 공간 안에 작성한다.
<style> /*applies to all the tags*/ * { font-family: 'Yeon Sung', cursive; } /*center everything*/ .wrap { width: 500px; margin: auto; } .item-image { width: 500px; height: 350px; /*for image*/ background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTVJcI3ksEmv60dmrFymYf6tsbtaHLufJRkrA&usqp=CAU"); background-size: cover; background-position: center; margin-bottom: 20px; } /*to centralize the button*/ .btn-primary { margin: auto; /*autoing margin alone doesn't work so adding the following code*/ display: block; } </style>
건조한 html에다가 CSS를 입히면서 아쉬운 부분들이 채워지는게 흥미롭다.
다음은 javascript! 얼마나 java랑 비슷한지 보러 가야겠다!!!