gpt4 book ai didi

css - 清爽 Material 精简设计 随机展示

转载 作者:行者123 更新时间:2023-11-28 16:45:40 25 4
gpt4 key购买 nike

我正在使用 Material Design和 Angularjs,但显示是随机的。

material-lite.css 好像有时加载,有时不加载。

Good

Bad

索引.html:

<html>
<head>
<meta charset="utf-8">
<title>title</title>

<!-- META TAG -->

<link rel="stylesheet" href="styles/material.indigo-deep_purple.min.css"/>
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="styles/autocomplete.css">
<link rel="stylesheet" href="styles/ngDialog.min.css"/>
<link rel="stylesheet" href="styles/ngDialog-theme-default.min.css"/>
<link href="https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

</head>
<body ng-app="tdcWebappApp">

<div ng-view=""></div>
</div>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-touch/angular-touch.js"></script>
<script src="bower_components/ngDialog/js/ngDialog.min.js"></script>

<script src="scripts/material.min.js"></script>
<script src="scripts/autocomplete.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/services.js"></script>
<script src="scripts/controllers/main.js"></script>

</body>
</html>

歌曲.html :

<div class="demo-layout mdl-layout mdl-js-layout mdl-layout--fixed-drawer mdl-layout--fixed-header" >
<main class=" mdl-layout__content mdl-color--grey-100 ">
<form>
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="mdl-tabs__tab-bar">
<a href="#identity" class="mdl-tabs__tab is-active">Identité</a>
<a href="#registration" class="mdl-tabs__tab" >Adhésion</a>
<a href="#activities" class="mdl-tabs__tab">Activités</a>
<a href="#payment" class="mdl-tabs__tab" ng-click="display()">Règlement</a>
</div>

<div class="mdl-tabs__panel is-active" id="identity">
...
</div>
...
</div>
</form>
</main>
</div>

拜托,你能给我解释一下这个机制是什么吗?

谢谢

最佳答案

如果你在 windows.load 之后添加一个元素,你必须手动升级 dom,因为 material-design-lite 不知道有新元素。 material-lite 添加了一个名为 componentHandler 的全局对象。添加新的 material-lite 元素后,只需执行此操作即可。

componentHandler.upgradeDom();
//OR
componentHandler.upgradeElement(element);

material-design-lite code

关于css - 清爽 Material 精简设计 随机展示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33211348/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com