html模板中的样式标签(在Aurelia视图中)？
html模板中的样式标签(在Aurelia视图中)？
提问于 2016-05-07 05:03:06
我能把一个<style>标签放在一个Aurelia视图的模板中吗？我有一个特定的问题，如果我在模板中有一个<style>标签，我的aurelia-对话框不能正确对齐(它浮动在屏幕顶部，而不是居中)。删除<style>标记后，所有内容都被正确放置。为视图/模板编写.css类的正确方法是什么？
示例:对于我的对话框组件(类似于引导模式)，我在dialog.html中有一个dialog.html和一个dialog.js，代码如下所示：
<template>
<style media="screen">
.selectedBorder {
border: 1px solid black;
}
</style>
<ai-dialog>
<ai-dialog-header>
Header
</ai-dialog-header>
<ai-dialog-body>
Sample body information
</ai-dialog-body>
<ai-dialog-footer>
Footer info
</ai-dialog-footer>
</ai-dialog>
</template>编辑:我想通了。您可以在模板中使用<style>标记。我的问题是，我让一个模板(主屏幕区域)调用另一个模板(弹出对话框)。我只需将<style>从dialog.html移到主视图的html中，一切都正常工作。
回答 1
Stack Overflow用户
发布于 2017-04-15 04:30:31
这可能不是流行的共识，但我一直在做的是使我的所有customer元素无容器，消除标记膨胀，然后使用id属性命名模板内容。例如：
someView.html：
<body>
<avatar-pic containerless></avatar-pic>
</body>avatar-pic.html
<template>
<section class="avatar-pic">
....
</section>
</template>avatar-pic.css
.avatar-pic {
...styles here
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37081390
复制相关文章
相似问题
腾讯云开发者
