1

Twitterのブートストラップを使用しています。私は、 「app.css」内にウェブサイト固有のスタイルを持つ追加の css ファイルを作成しました。

そして、別のsite.cssを作成し、その中に次のコードを書きました-

@import url('../Content/bootstrap/css/bootstrap.min.css');
@import url('../Content/bootstrap/css/bootstrap-responsive.min.css');
@import url('../Content/bootstrap/css/app.css');

そして、レイアウト ファイルで site.css を使用しました。

そして、スタイリングに従って書かれたapp.css内-

.margin0 {
margin:0;
}

.text-span{
    width: 100%;
  }

.text-center {
text-align:center;
}

そのように。

そして、ブートストラップスタイリングを使用して上記のクラスを適用しています-

<div class="span4">
   <span class="text-span hideOverflow">@Html.ActionLink(item.Name, "Details", new { id = item.Id }, new { @class = "JumpLinks", @style = "font-size:13px;font-weight:bold;" })</span>
   <span style="color: #ADADAD; font-size: 11px;" class="text-span margin0">@Html.DisplayFor(modelItem => item.StartDate)</span>
</div>

今の問題は、私のmargin0が私が望むように適用されていないことです。CSS効果をオーバーライドするブートストラップスタイルの効果。そして、私はそれを起こさせたくありません。この問題を解決するには?

要素を調べたところ、クラスの下のブートストラップによってクラスがオーバーライドされました-

.row-fluid [class*="span"] {
display: block;
float: left;
width: 100%;
min-height: 30px;
margin-left: 2.127659574468085%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
4

1 に答える 1

0

試す

<div class="span4">
<span class="text-span hideOverflow">@Html.ActionLink(item.Name, "Details", 
 new { id =  item.Id }, new { @class = "JumpLinks", @style = "font-size:13px;
  font-  weight:bold;" })</span>
    <span style="color: #ADADAD; font-size: 11px;margin:0px !important; " class="
     text-span">@Html.DisplayFor(modelItem => item.StartDate)</span>
</div>
于 2013-03-11T06:18:23.070 に答える