2015-11-06 12 views
5

Đây là cách mã của tôi trông giống như trên CodePen:thay đổi màu của <md-toolbar>?

Tôi muốn nền của "Sidenav Left" là của "Menu Items", được đại diện bởi lớp như

.nav-theme { 
    background-color: #34495E 
} 

Tôi đã cố gắng trọng nó như

.nav-theme, .md-theme-indigo { 
    background-color: #34495E 
} 

nhưng điều đó không hiệu quả, tôi cần phải làm gì?

Trả lời

4

Cụ thể hơn trong lựa chọn CSS để ghi đè. Vì các công cụ chọn bên dưới cụ thể hơn, mức độ ưu tiên của chúng sẽ cao hơn màu nền mặc định chưa được ghi đè trước đó. Bằng cách này bạn đang tránh việc sử dụng !important

.md-sidenav-left .md-theme-indigo, .md-sidenav-left .nav-theme { 
    background-color: #34495e; 
} 

CodePen Demo

1

Bạn có thể sử dụng các chỉ thị md-colors để đặt nó vào một màu từ bảng màu của bạn. Bằng cách đó, nó sẽ tự động thay đổi nếu bạn chọn một chủ đề khác.

<md-toolbar md-colors="::{backgroundColor: '{{theme}}-primary-700'}" 
Các vấn đề liên quan