목록IT/HTML, CSS (2)
And Brain said,
[CSS] 프론트의 기본 px, em, rem
px은 환경에 반응하지 않는 절대적 수치 em과 rem은 환경에 반응하는 상대적 수치 em과 rem의 차이는 em은 같은 엘리먼트에서 지정된 font-size를 기준으로 px로 바뀌어 화면에 표시. rem은 최상위 엘리먼트에서 지정된 font-size의 값을 기준으로 변환. rem은 기준이 되는 폰트 크기 하나로 고정되어 있는 반면, em은 같은 엘리먼트는 어디서라도 그 기준이 바뀔 수 있기 때문에 복잡한 css를 가질 경우 변환될 크기를 예측하기 어렵다. 반응형 웹이 점점 더 많아지는 요즘 추세에 px은 어울리지 않다. Thanks for watching, Have a nice day.
IT/HTML, CSS
2022. 9. 15. 01:28
Pug야, 이리오너라! [template engine]
템플릿 엔진은 굉장히 많으며 어떤 것을 사용해도 상관없다. 실무에선 그냥 기본적인 html문법을 쓰는게 더 바람직할 수도. 허나 독특한 것을 좋아하는 나는 단지 신기해 보여서 써봤는데 의외로 편하다. html-css를 다뤄봤다면 전혀 어렵지 않고 오히려 이 못생긴 강아지의 독특함 그리고 세련됨에 매료될 것이다. 물론 굳이 안 써도 된다. 일단 이리오너라를 한다. Pug 문법은 닫기 태그가 없으며 들여쓰기로 블록을 구분하며 ( )으로 attribute를 사용 가능하다. =을 이용하여 변수를 사용가능하다. 공식 홈페이지의 예시를 보면서 적용해보면 처음엔 다소 귀찮고 불편하지만 이후엔 아주 편하단 것을 느낄 수 있을 것이다. 그럼 여러분들도 Pug 한 마리 들여보길 바라면서 Pug야, 이리오너라! Thanks..
IT/HTML, CSS
2022. 8. 18. 01:07