htmlテンプレート内のスタイルタグ（Aureliaビュー）？

<style>タグをAureliaビューのテンプレートに入れることはできますか？私は、テンプレートで<style>タグを持っている場合は、私のアウレリア・ダイアログが（それは画面の上部に浮かん代わりの真ん中に中心です）正しく整列されていない特定の問題を抱えています。 <style>タグを削除すると、すべてが正しく配置されます。ビュー/テンプレート用に.cssクラスを記述する適切な方法は何ですか？htmlテンプレート内のスタイルタグ（Aureliaビュー）？

例：

<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>

編集：（ブートストラップモーダルに似ている）私のダイアログコンポーネントのために、私はdialog.htmlインサイドdialog.htmlとdialog.js を持っている、コードは次のようになります：私はそれを考え出した。テンプレート内に<style>タグを含めることができます。私の問題は、私は別のテンプレート（ポップアップダイアログ）を呼び出すつのテンプレート（メイン画面領域）を有していたということでした。私は、メインビューのHTMLにdialog.htmlから<style>を移動しなければならなかったし、すべてが正常に働いていました。

出典

2016-05-06 Rohhan

これは人気のコンセンサスが、私は、私の顧客の要素の無容器の全てを作ることをやってマークアップの膨張を排除して、id属性を持つテンプレートコンテンツを名前空間をされていない可能性があります。例：

someView.html：

<body> 
    <avatar-pic containerless></avatar-pic> 
</body>

アバター-pic.html

<template> 
    <section class="avatar-pic"> 
     .... 
    </section> 
</template>

アバター-pic.css

.avatar-pic { 
    ...styles here 
}

出典

2017-04-14 20:30:31

htmlテンプレート内のスタイルタグ（Aureliaビュー）？

答えて

関連する問題