3

Durandal は、データ ビューをラップする div 要素に次のインライン スタイルを自動的に追加するように見えます。

style="margin-left: 0px; margin-right: 0px; opacity: 1; display: block;"

これは、Durandal と、Durandal を利用する John Papa ホット タオル ASP.NET SPA テンプレートの両方で発生します。

このインライン スタイルは外部スタイルシートをオーバーライドしているため、この動作を無効にする必要があります。これはJavaScriptファイルの1つによって注入されていると思いますが、私の人生ではどこにあるかを理解することはできません.

このインライン スタイルが追加されないようにする方法を知っている人はいますか?

4

2 に答える 2

6

これは「入口」トランジション (durandal/transitions/entrance.js) によって設定されています。トランジションの最終エンドポイントはこれらの値のように見え、トランジションが完了してもそれらは削除されません。

トランジションを使用しないことで、これを完全に回避できます。これにはいくつかの手順が必要です。

  1. main.js で、app.setRoot() 呼び出しを変更して「entrance」パラメーターを削除します。これにより、スタイル設定がシェル コンテナーに追加されなくなります。
  2. shell.html で、compose バインディングから遷移設定を削除します。これにより、スタイリング設定が個々のビューに追加されなくなります。

もう 1 つの可能性は、CSS 要件との互換性がより高い独自のトランジションを作成することです。

于 2013-04-05T03:45:13.120 に答える
1

入り口のトランジションがこのスタイルをビューの最上位要素に追加するため、現在のビュー コンテンツを別の div でラップし、これらの値を適用するヒットを取得できる場合があります。

前：

<div class="container-narrow">    
    <div class="row-fluid">
        <div class="span12">
            <h2>Title</h2>
            ....
        </div>
    </div>
</div>

後：

<div>
    <div class="container-narrow">    
        <div class="row-fluid">
            <div class="span12">
                <h2>Title</h2>
                ....
            </div>
        </div>
    </div>
<div>

これは、コンテナの狭いdivを中央に配置していた私のインスタンスで機能しました

.container-narrow 
{
margin: 0 auto;
max-width: 400px;
}

移行後に失われていた

于 2013-04-16T19:06:56.727 に答える