CSS에서 고정된 위치 지정 속성 위치 사용 소개

이 글에서는 CSS에서 고정된 위치 지정 속성의 사용 방법을 주로 소개합니다. 이제 특정 참조 값이 있어 공유합니다. 도움이 필요한 친구들이 참조할 수 있습니다.

div가 위치 지정을 원할 때 첫 번째 반응은 위치 속성에 기본 값 외에 절대, 상대, 고정도 포함됩니다. 이해하지 못하는 친구는 이를 참조할 수 있습니다.

HTML에서 p가 원할 때. 위치를 지정하려면 첫 번째 반응은 위치 속성이며, 위치 속성에는 기본값 외에 절대, 상대 및 고정도 포함됩니다. 고정으로 설정하면 왼쪽, 오른쪽, 위쪽, 아래쪽 값을 설정하여 몸체를 기준으로 위치를 지정할 수 있습니다.

코드:

.my-fiexd{ 
position:fixed; 
height:40px; 
width:40px; 
background-color:red; 
border:0px; 
}

그러나 스크롤 바가 스크롤될 때 p를 고정으로 설정하면(상단, 많은 메뉴에서 이 작업을 수행함) 작은 현상이 발생할 수 있습니다(버그라고 할 수 있음). 구체적인 코드는 다루지 않고 현상과 해결방안에 대해서만 이야기하겠습니다.

높이가 100px인 페이지에 ID가 my-fixed인 p가 있는 경우 my-fixed의 높이는 20px이고 스크롤 막대가 30px로 스크롤되면 my-fixed에 fiexd 속성이 추가되고 my-fixed에는 my-fixed가 추가됩니다. -fixed는 이때 페이지가 분리되며, 해당 페이지 높이도 20px를 빼야 하며, 페이지 높이가 80px일 수 있습니다. 이때 스크롤 막대가 스크롤할 수 있는 최대 높이는 30px 미만일 수 있습니다. 이번에는 my-fixed가 계속 픽스를 추가하고 픽스를 추가하지 않을 것입니다. 시간이 계속 깜박거리고 결국 my-fixed는 픽스가 되지 않습니다.

해결 방법은 my-fixed의 바깥 레이어에 p를 추가하고 my-fixed와 동일한 높이를 설정하여 my-fixed가 분리될 때 페이지의 높이가 줄어들지 않고 깜박임 현상이 발생할 수 있도록 하는 것입니다. 잘 피하세요

ps: 처음으로 블로그를 작성합니다. 표현이 명확하지 않을 수 있지만 일반적인 의미는 정확해야 합니다. 동일한 문제가 발생하고 더 나은 해결책이 있는 경우 질문을 환영합니다. 알아요

위 내용은 이 글의 전체 내용입니다. 여러분의 학습에 도움이 되길 바랍니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요!

관련 권장 사항:

css3에 의해 구현된 수직 보조 탐색

DIV를 중앙에 배치하기 위해 position:fixed 속성을 사용하는 방법

위 내용은 CSS에서 고정된 위치 지정 속성 위치 사용 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!