css 사용 전 초기화하기 :
<style.css>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
전체 태그에 마진, 패딩 값을 0으로 하고 박스 사이징을 border box로 설정 함으로써
박스들의 크기 조절이 쉽게 만들어 준다.
<박스 내 텍스트를 세로 정렬하기>
<html>---
<div id="box">
<h4 id="text">정렬 할 텍스트</h4>
</div>
<style.css>---
#box{
weight: 100px;
height: 25px;
}
#text{
line-height: 25px; //line-height를 부모 div박스의 높이와 똑같이 함으로써 야매(?)로 세로 정렬을 할 수 있다.
}
이전에 완성했던 자기소개 페이지에 css를 적용해
좀 더 스타일을 넣어서 직관적으로 페이지를 표현해보았다.
이번 유닛에서 CSS 기초 지식들을 좀 더 탄탄히 알게 되면서
좀 더 확신을 가지고 코딩을 하게 되고 있는것 같아서 좋다~~
내일을 첫 페어로 과제를 하게 되는데
최대한 피해주지않고 서로 협업할 수 있도록 도와야겠다.
캐릭터가 몹시.. 귀여우시네요..! 화이팅입니다..!