[5월 26일]

정서이·2022년 5월 26일

1) 학습한 내용

1.고양이 페이지

(1)aside

①코드

②결과

(2)aside li태그

①코드

②결과


(3)form

①코드

②결과

(4)footer

①코드

②결과

(5)@media

-aside 부분이 오른쪽 배치가 되게 함

①코드

②결과

2.emmet

emmet 사이트
-코드를 빠르게 작성하게 해주는 도구

①html 기본 요소

②부모

③자식

④반복(여러 개 작성)

⑤태그에 class,id 순번지정

3.기타

hover 설정 참고 사이트
코드 비교 사이트-오타찾기
애니메이션 라이브러리 사이트

2) 학습내용 중 어려웠던 점

.newsletter-form input[type='email']::placeholder{color:skyblue;}
: 수업시간 코드랑 똑같이 했는데 설정이 되지 않았다.
form을 작성할 때 글자색을 바꾸는 설정이라고 잘못 알고 있었다.

3) 해결방법

:placeholder 가 아니라 ::placeholer로 하여야 하고 form을 작성할 때가 아닌 기본설명글의 글자색을 바꾸는 설정인 것을 검색을 통해 깨달았다.
그 후 여러가지 색으로 바꿔가면서 변화를 관찰하니 이해가 되었다.

4) 학습소감

emmet을 이용하니 코드를 훨씬 간편하고 빠르게 작성할 수 있어서 좋았다.

0개의 댓글