# sticky

27개의 포스트

면접 스터디 - 4일차

HTTP는 hypertext transfer protocol의 약어입니다. hypertext는 웹페이지를 연결하는 링크를 뜻합니다. transfer는 전화 같은 것을 연결하다는 의미인데 인터넷의 경우 특정 페이지를 의미합니다. protocol은 절차를 뜻하는데 인터넷

1일 전
·
0개의 댓글
·

Layout - Positioning

요소를 일반적인 문서 흐름에 따라 배치한다.positon: sticky 속성을 적용한 요소는 평소 문서 안에서 positon: static 상태와 같이 일반적인 문서 흐름에 따라 배치해 있다가, 스크롤 위치가 임계점(내가 지정한 top / bottom / left /

2023년 2월 14일
·
0개의 댓글
·

[CSS] 포지셔닝 2-9

position 속성 position 속성은 요소들이 화면에 어떻게 배치될지를 지정한다. 특이사항으로는, 이 속성은 자식 요소에게 대물림되지 않는다는 점이 있다. static static은 기본값으로, 전적으로 페이지의 흐름을 따르며 top, bottom, left,

2023년 1월 26일
·
0개의 댓글
·

position - sticky

스크롤 하는 대상의 자식을 기준으로 top, right, bottom, left의 값에 따라 오프셋을 적용합니다.링크텍스트( See the Pen Untitled by Jeong-Dagyeong (@jeong-dagyeong) on CodePen. )

2022년 8월 1일
·
0개의 댓글
·

페이지 스크롤에 역행하기 또는 순행하기

이 이야기는 반응형 레이아웃 디자인을 위한 빌드임을 먼저 알리고 시작한다.

2022년 7월 10일
·
0개의 댓글
·

[CSS] position : sticky

position : sticky는 스크롤 시 화면에 고정되는 요소를 만들 수 있는 css 속성입니다. position : fixed는 항상 화면에 고정되는 요소를 만들때 사용하는데 이 둘이 무슨 차이가 있냐면,position : sticky는 스크롤이 되어시 이 요소가

2022년 6월 20일
·
0개의 댓글
·
post-thumbnail

position property

position css 에서 position 이란? 요소들을 배치하기 위해 사용되는 방법을 지정하며 5가지의 값이 있습니다. static relative fixed absolute sticky 요소들은 위, 아래, 좌, 우 속성들을 사용하여 배치됩니다. 그러나, 이

2022년 4월 26일
·
0개의 댓글
·
post-thumbnail

[CSS] Position

absoluterelativefixedtop, left, right, bottomz-index▶️ box3의 부모 = html 이므로 화면 맨윗부분 왼쪽에서 밑, 오른쪽으로 30px씩 떨어진 부분에 위치.▶️ box2(absolute)의 부모 = box1(relativ

2022년 4월 12일
·
0개의 댓글
·

TIL - position : Fixed, sticky

fixed 스크롤에 관계없이 특정 박스가 고정되어 움직이지 않음페이지가 스크롤 되어도 중요한 정보(nav bar)를 화면에 노출하기 위해 사용sticky고정된 상태를 유지하다가 스크롤 되는 가장 가까운 부모 요소에 달라붙음! 요소를 일반적인 문서 흐름에 따라 배치하고

2022년 4월 11일
·
0개의 댓글
·

[CSS] position : fixed VS sticky

position 속성은 문서 상에 요소를 배치하는 방법을 지정!값으로는 top, right, bottom, left 등이 있다.static : 기본값relative : 요소를 일반적인 문서 흐름에 따라 배치하고 자기 자신을 기준으로 top, right, botto, l

2022년 4월 11일
·
0개의 댓글
·

[CSS-layout] position 속성

position 속성 - relative, absolute, fixed

2022년 3월 2일
·
0개의 댓글
·
post-thumbnail

css - (position) 속성 공부

\-static따로 값을 주지 않으면 기본적으로 적용되있는 값 그러기 때문에top,right,bottom,left 속성들을 사용할 수가 없다입력을 해도 변화가 없음을 알수있다. no startic/pngstartic/pngtop,right,bottom,left : 속

2022년 2월 15일
·
0개의 댓글
·
post-thumbnail

WIL-CSS [Position]

💡 position은 '위치'란 뜻으로 요소들의 위치를 지정해주는 속성이다.이 속성을 이용해 페이지의 레이아웃을 결정할 수 있다.1\. Static & relative & absolute 💡 static은 position의 기본값이다. 기본적으로 특정한 positi

2021년 11월 6일
·
0개의 댓글
·
post-thumbnail

CSS_position

css를 그림판처럼 자유롭게 이용하려면 꼭꼭꼭 필요한 css_position! 아직도 헷갈리는 부분은 있지만 아는 만큼만 우선 정리해보기로 position 📕웹페이지에서 태그들의 위치를 지정할 때 사용 한다. 1.static 기본값 기본적으로 아무것도 없을 때 사

2021년 11월 5일
·
0개의 댓글
·
post-thumbnail

Position, z-index

CSS position 속성은 문서 상에 요소를 배치하는 방법을 지정한다. top, right, botton, left 속성이 요소를 배치할 최종 위치를 결정한다.일반적인 문서 흐름에 따라 요소를 배치한다. top, right, botton, left, z-index

2021년 10월 12일
·
0개의 댓글
·
post-thumbnail

[CSS] position 을 적용하면 Layout 단계에서 어떤 일이 일어날까 ?

position의 사용법에 더한, 브라우저 최적화를 위한 방법 내부 동작원리를 알고 싶다면 클릭 !

2021년 8월 9일
·
0개의 댓글
·
post-thumbnail

💅 CSS :: Position, Display, Float에 대해 알아보기

각 요소의 배치, 레이아웃을 표현하며 CSS의 뼈대를 형성해주는 CSS position, display, float에 대해 알아봅니다🤓

2021년 5월 25일
·
0개의 댓글
·
post-thumbnail

[TIL 02] CSS Layout: Position

CSS의 position 속성은 HTML 요소들의 위치를 설정하는 데 사용됩니다.position 속성의 값으로는 static, relative, absolute, fixed, sticky 이렇게 다섯 가지가 있습니다.요소를 배치하는 방법의 유형이며, 각 유형에 따라 t

2021년 5월 13일
·
0개의 댓글
·
post-thumbnail

TIL 48 | 좌표구하기 1. Window sizes and scrolling

sticky 헤더를 자바스크립트로 구현해보기 위하여 현재 스크롤 상태 값을 가져오는 연습을 하고 있다. 이 과정에서 접하게된 브라우저 창의 너비/높이를 표현하는 방식과 스크롤을 제어하는 방법을 정리해두려 한다. Width/height of the window win

2021년 4월 7일
·
0개의 댓글
·