md-toolbar background-color: transparent not working

Question

Я немного ударился головой об этом ... я понятия не имею, почему фон моей панели инструментов md остается белым, хотя я меняю CSS ,

У меня есть образец моего проекта здесь:

http://abc.morado.xyz:32782/#/index

моей страница HTML по умолчанию, который отображает все представления выглядят следующим образом:

<div layout="row" class="full-height transparent"> 
<!-- left sidebar --> 

<!--<md-sidenav class="admin-sidebar-left md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="layout.sideMenuSize !== 'hidden' && $mdMedia('gt-sm')" ui-view="sidebarLeft" ng-class="{ 'admin-sidebar-collapsed': layout.sideMenuSize == 'icon' }" ng-mouseover="layoutController.activateHover()" ng-mouseleave="layoutController.removeHover()"></md-sidenav>--> 

<!-- main content --> 
<div id="admin-panel" layout="column" flex class="transparent"> 
    <!-- loading animation --> 
    <tri-loader></tri-loader> 

    <!-- top toolbar --> 
    <md-toolbar class=" transparent" ng-if="layout.showToolbar" md-theme="{{triSkin.elements.toolbar}}" ui-view="toolbar" ng-class="[layout.toolbarSize,layout.toolbarClass]"></md-toolbar> 

    <!-- scrollable content --> 
    <md-content ng-class="layout.contentClass" flex tri-default-content ui-view="content"></md-content> 

    <div ui-view="belowContent"></div> 
</div> 

<!-- right sidebar --> 
<md-sidenav layout layout-fill class="md-sidenav-right md-whiteframe-z2" md-component-id="notifications" ui-view="sidebarRight"></md-sidenav> 

И заголовок получает в моем конфигурационном файле:

.state('triangular.header', { 
      abstract: true, 
      views: { 
       toolbar: { 
        templateProvider: function($templateCache, $http, triLayout) { 
         return $http.get(triLayout.layout.toolbarTemplateUrl, {cache: $templateCache }) 
          .then(function(response) { 
           return response.data; 
          }); 
        }, 
        controllerProvider: function(triLayout) { 
         return triLayout.layout.toolbarController; 
        }, 
        controllerAs: 'vm' 
       }, 
       content: { 
        templateProvider: function($templateCache, $http, triLayout) { 
         return $http.get(triLayout.layout.contentTemplateUrl, {cache: $templateCache }) 
          .then(function(response) { 
           return response.data; 
          }); 
        } 
       }, 
       belowContent: { 
        template: '<div ui-view="belowContent"></div>' 
       } 
      } 
     }) 

Я видел эти решения в Интернете, но они не работают в моем случае ...

https://github.com/angular/material/issues/4379

My own styles in angular material ui

Если вы идете к моей ссылке выше и попробовать играть с CSS самостоятельно, вы обнаружите, что установка фона в теге md-toolbar или в div внутри указанного тега делает фоном непрозрачным белым.

Благодарим за помощь!

Answer 1

я понятия не имею, когда на фоне моей мкр-панели остается белым, даже если я изменить CSS

фона этого элемента является прозрачным, как вы указали в CSS.

Белый цвет, который вы видите, просто фон элемента тела.