Dongi_coding 동기_코딩

안녕하세요 동기 여러분! 오늘은 포지션 프로퍼티의 값인 스티키에 대해 알아봅시다! Position: Sticky 혹시 라이언 일병 구하기라는 영화를 보신적이 있나요? 거기에 보면 보병들이 독일군의 탱크를 불능 상태로 만들기 위해 스티키 범(Sticky Bomb)이라는걸 만들어서 작전에 사용하는데 보병들이 탱크가 공격할 수 없는 사각지대로 몰래 접근하여 탱크의 무한궤도(탱크 바퀴)에 폭탄을 붙이고 달아납니다. 그러면 폭탄이 터지고 탱크는 움직일 수가 없는 상태가 되죠. 네 ~ sticky의 뜻인 '끈적거리는, 달라붙는'을 말하고 싶어서 영화 이야기를 해보았습니닼ㅋㅋㅋ 오늘 알아볼 Sticky도 달라붙는 친구이기 때문에 뜻을 유념하면서 가봅시다~ Position: Sticky는 fixed와 비슷한 기능을 가..

안녕하세요 동기 여러분! 오늘은 포지션 프로퍼티의 값인 픽스드에 대해 알아봅시다! Position: Fixed Fixed는 영어사전에 찾아보면 '고정된'이라는 뜻을 가지고 있다. 그렇다 이 녀석은 요소를 내가 정한 위치에 고정시켜 주는 녀석이다. -> 이 말은 웹 페이지가 커지든 작아지든 스크롤을 내리든 올리든 상관없이 요소가 정해진 자리에 고정된다는 소리 진짜 고정이 되는지 해봅시다. 난 모르는 사람 난 부모 난 자식 /* CSS */ div { border: 8px solid palevioletred; margin: 20px; } #parent { height: 5000px; /*

안녕하세요 동기 여러분! 오늘은 포지션의 프로퍼티의 값인 엡솔루트(보드카)에 대해 알아보도록 합시다! Position: Absolute HTML의 요소 위치를 지정하는 방법이 다섯 가지가 있는데 그중 한 가지가 Absolute이다. Absolute absolute를 영어사전에서 찾아보면 형용사로는 '완전한, 완벽한' 명사로는 '절대적인 것'이라는 뜻이 있다. 그렇다. position: absolute는 절대적인 파워로 요소를 움직이는 것이다. 아래의 코드와 실행화면을 보자. 난 모르는 사람 난 부모 난 자식 /* CSS */ div { border: 8px solid palevioletred; margin: 20px; } #child { position: absolute; } 포지션의 값을 엡솔루트로 설..

안녕하세요 동기 여러분! 오늘은 포지션 프로퍼티의 값인 스태틱과 릴레이티브에 대해 알아보도록 합시다! Position: Static, Relative HTML의 요소의 위치를 지정하는 방법이 5가지가 있는데 그중 두 가지가 Static과 Relative이다. Static static을 영어사전에 찾아보면 '고정된, 정지 상태의' 또는 '정전기'라는 뜻을 가지고 있다. 혹시 디아블로2를 하는 유저라면 원소술사의 기술 스태틱 필드를 들어본 적이 있을 것이다. 정전기 공격인데 고정된 양 만큼의 적의 체력을 깎는 무시무시한 기술이다. 음.. 이걸 안다면 static의 '고정된, 정지 상태의' 라는 뜻을 더 외우기 쉽다. (디아블로2 개발자들의 작명 센스가 돋보인다 고정된 데미지를 주는 정전기 기술이라니 영어로 ..