"일꾼이 일을 잘하려면 먼저 도구를 갈고 닦아야 한다." - 공자, 『논어』.
첫 장 > 프로그램 작성 > 전체 내비게이션 바 목록 항목을 클릭 할 수있는 방법은 무엇입니까?

전체 내비게이션 바 목록 항목을 클릭 할 수있는 방법은 무엇입니까?

2025-03-25에 게시되었습니다
검색:665

How to Make the Entire Navigation Bar List Item Clickable?

이 문제를 해결하려면 'li'요소에 패딩을 적용하는 것이 목록 항목의 클릭 가능 영역을 제한 할 수 있음을 이해하는 것이 필수적입니다. 클릭 가능한 영역을리스트 항목의 전체 너비를 덮기 위해 확장하려면 패딩을 앵커 태그 ( 'A'요소) 대신 대신 'inline-block'으로 설정하여 앵커 태그의 '디스플레이'속성을 '인라인 블록'으로 설정하여 텍스트 내용의 흐름 내에서 인라인 요소처럼 작동하지만 블록 요소로 처리되어 폭과 높이를 수락 할 수 있습니다. 이를 통해 앵커 태그에 패딩을 적용하여 클릭 가능한 영역을 효과적으로 확장하여 목록 항목의 전체 너비를 커버 할 수 있습니다.

여기에는 'li'요소 대신 앵커 태그에 적용되는 패딩이있는 코드의 업데이트 된 버전이 있습니다. 디스플레이 : 블록; 플로트 : 왼쪽; } #nav a { 색상 : 흰색; Font-Family : Helvetica, Arial, Sans-Serif; 텍스트 결정 : 없음; 디스플레이 : 인라인 블록; 패딩 : 25px 10px; }

각 목록 항목의 전체 영역을 링크로 클릭 할 수있어 사용자가 쉽고 편리하게 탐색 할 수 있습니다.

최신 튜토리얼 더>

부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.

Copyright© 2022 湘ICP备2022001581号-3