css 블록요소 인라인요소 codepen
1. 블록 요소
DIV,H1,P
사용 가능한 최대 가로 너비를 사용한다
크기를 지정할 수 있다
width: 100%; height: 0; 으로 시작
수직으로 쌓임
margin, padding 위,아래,좌,우 사용 가능하다
레이아웃
2. 인라인 요소
SPAN, IMG
필요한 만큼의 너비를 사용한다
크기를 지정할 수 없다
width: 0; height: 0; 으로 시작
수평으로 쌓임
margin, padding 위,아래는 사용을 할 수 없다
TEXT
reset.css cdn
www.jsdelivr.com/package/npm/reset-css
jsDelivr - A free, fast, and reliable CDN for Open Source
Supports npm, GitHub, WordPress, Deno, and more. Largest network and best performance among all CDNs. Serving more than 80 billion requests per month. Built for production use.
www.jsdelivr.com
codepen
CodePen
An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications.
codepen.io
padding
box-sizing: border-box;
background-attachment: fixed; 배경고정
transition-timing-function: ease;
easing function
Easing Functions Cheat Sheet
Easing functions specify the speed of animation to make the movement more natural. Real objects don’t just move at a constant speed, and do not start and stop in an instant. This page helps you choose the right easing function.
easings.net