수직 탐색 막대 예제

수직 탐색 막대 예제

배경색이 회색 인 기본 세로 탐색 막대를 만들고 사용자가 마우스를 움직일 때 링크의 배경색을 변경합니다.

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
}

li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

/* Change the link color on hover */
li a:hover {
    background-color: #555;
    color: white;
}

활성 / 현재 탐색 링크

현재 링크에 "활성"클래스를 추가하여 사용자가 어떤 페이지에 있는지 알 수있게하십시오 :

.active {
    background-color: #4CAF50;
    color: white;
}
|
댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
반응형 8년 전 조회 2,169
반응형 8년 전 조회 2,137
반응형 8년 전 조회 2,469
반응형 8년 전 조회 2,612
반응형 8년 전 조회 2,713
CSS 8년 전 조회 2,848
CSS 8년 전 조회 2,919
CSS 8년 전 조회 2,875
CSS 8년 전 조회 2,577
CSS 8년 전 조회 2,266
CSS 8년 전 조회 2,352
CSS 8년 전 조회 3,825
CSS 8년 전 조회 3,165
CSS 8년 전 조회 2,408
CSS 8년 전 조회 1,898
CSS 8년 전 조회 2,350
CSS 8년 전 조회 1,843
CSS 8년 전 조회 5,523
CSS 8년 전 조회 3,494
CSS 8년 전 조회 3,299
CSS 8년 전 조회 2,373
HTML 8년 전 조회 3,313
HTML 8년 전 조회 3,767
CSS 8년 전 조회 2,678
CSS 8년 전 조회 2,160
CSS 8년 전 조회 1,930
CSS 8년 전 조회 2,919
CSS 8년 전 조회 2,805
CSS 8년 전 조회 3,321
CSS 8년 전 조회 2,020