수직 탐색 막대 예제

수직 탐색 막대 예제

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

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,170
반응형 8년 전 조회 2,141
반응형 8년 전 조회 2,471
반응형 8년 전 조회 2,615
반응형 8년 전 조회 2,716
CSS 8년 전 조회 2,852
CSS 8년 전 조회 2,922
CSS 8년 전 조회 2,878
CSS 8년 전 조회 2,581
CSS 8년 전 조회 2,272
CSS 8년 전 조회 2,357
CSS 8년 전 조회 3,832
CSS 8년 전 조회 3,173
CSS 8년 전 조회 2,417
CSS 8년 전 조회 1,907
CSS 8년 전 조회 2,358
CSS 8년 전 조회 1,849
CSS 8년 전 조회 5,534
CSS 8년 전 조회 3,501
CSS 8년 전 조회 3,307
CSS 8년 전 조회 2,381
HTML 8년 전 조회 3,324
HTML 8년 전 조회 3,777
CSS 8년 전 조회 2,682
CSS 8년 전 조회 2,167
CSS 8년 전 조회 1,933
CSS 8년 전 조회 2,924
CSS 8년 전 조회 2,809
CSS 8년 전 조회 3,327
CSS 8년 전 조회 2,028