수직 탐색 막대 예제

수직 탐색 막대 예제

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

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,173
반응형 8년 전 조회 2,143
반응형 8년 전 조회 2,473
반응형 8년 전 조회 2,617
반응형 8년 전 조회 2,718
CSS 8년 전 조회 2,854
CSS 8년 전 조회 2,925
CSS 8년 전 조회 2,880
CSS 8년 전 조회 2,582
CSS 8년 전 조회 2,273
CSS 8년 전 조회 2,357
CSS 8년 전 조회 3,832
CSS 8년 전 조회 3,176
CSS 8년 전 조회 2,418
CSS 8년 전 조회 1,910
CSS 8년 전 조회 2,358
CSS 8년 전 조회 1,850
CSS 8년 전 조회 5,534
CSS 8년 전 조회 3,501
CSS 8년 전 조회 3,308
CSS 8년 전 조회 2,381
HTML 8년 전 조회 3,325
HTML 8년 전 조회 3,778
CSS 8년 전 조회 2,684
CSS 8년 전 조회 2,168
CSS 8년 전 조회 1,935
CSS 8년 전 조회 2,927
CSS 8년 전 조회 2,813
CSS 8년 전 조회 3,328
CSS 8년 전 조회 2,030