css예제6 CSS 단위 em 과 rem 예제 level 1 level 2 level 3 level 4 -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- .level1 { font-size: 2em; /*32px*/ } .level2 { font-size: 2em; /*부모클래스 (level1)를 기준으로 하기 떄문에 64px*/ } .level3 { font-size: 2em; /*부모클래스 (level2)를 기준으로 하기 때문에 128px*/ } .level4 { font-size: 2em; /.. 2022. 1. 19. CSS Flexbox2 1 2 3 ------------------------------------------------------------------------------------------------------------------ .container { padding-top: 100px; background: beige; height: 100vh; display: flex; } .item { width: 40px; height: 40px; border: 1px solid black; } .item1 { background: #ef9a9a; order: 0; /*item의 순서를 바꿀 수 있음*/ flex-grow:1; /*container를 꽉 채우려고 함*/ flex-shrink: 1;/*container가 줄어들때.. 2022. 1. 11. CSS Flexbox 1 1 2 3 4 5 6 7 8 9 10 ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ .conatiner { background: beige; height: 100vh; /*부모에 상관없이 html공간을 100% 사용하겠다는 의미vh;*/ display:flex; flex-direction: row-reverse; /*flex의 방향설정 가로 row 방향전환 reverse*/ flex-direction: column-reverse; /*flex의 방향설정.. 2022. 1. 11. css/html 블로그 만들기 실습예제 5 son blog 아이디 @naver.com 필수 정보입니다. 비밀번호 필수 정보입니다. 비밀번호 재확인 필수 정보입니다. 이름 필수 정보입니다. 생년월일 월 1 2 3 4 5 6 7 8 9 10 11 12 필수 정보입니다. 가입하기 이름: 손효현 연락처: 010-1234-5678 주소: 부산 동래구 명륜로 이메일: dfsdfsd11@kakao.com ---------------------------------------------------------------------------------------------------------------------------------------------- const join_text = document.querySelectorAll(".join_text");.. 2021. 6. 27. 이전 1 2 다음