0

これがだまされている可能性があることはわかっていますが、複数のソリューションを調査したことに自信があるので、喜んでヒットします.

This box-shadow transition を機能させるために、次のような多くの方法を試しました。

  • box-shadow宣言で 16 進数、RGB、RGBA の色を切り替えます。
  • より具体的なセレクターの使用。
  • 宣言の最後transitionに含めるプロパティを変更します。ease-in-out
  • transition要素に影響を与える可能性のあるすべてのプロパティの CSS ファイルをクレンジングしました。
  • その間ずっと、スペルミスをトリプルチェックしています。

検査官は、私のスタイルは上書きされていないと言っています。これが私のコードです：

.site-header .genesis-nav-menu .menu-item a {
  -webkit-box-shadow: 3px 3px 14px rgb(0,0,0) inset;
  -moz-box-shadow: 3px 3px 14px rgb(0,0,0) inset;
  -o-box-shadow: 3px 3px 14px rgb(0,0,0) inset;
  box-shadow: 3px 3px 14px rgb(0,0,0) inset;
  -webkit-transition: box-shadow 3s;
  -moz-transition: box-shadow 3s;
  -o-transition: box-shadow 3s;
  transition: box-shadow 3s;
}

.site-header .genesis-nav-menu .menu-item a:hover{
  -webkit-box-shadow: 3px 3px 14px rgb(0,0,0);
  -moz-box-shadow: 3px 3px 14px rgb(0,0,0);
  -o-box-shadow: 3px 3px 14px rgb(0,0,0);
  box-shadow: 3px 3px 14px rgb(0,0,0);
}

これが何もしない原因はここで何が起こっているのでしょうか?

これは、コンテキスト内での体験のための私のサイトへのリンクです。ページの右上隅にあるヘッダー メニューです。

4

2 に答える 2

1

試す：

.site-header .genesis-nav-menu .menu-item a {
  -webkit-box-shadow: 0 0 0 rgba(0,0,0,0), 3px 3px 14px rgb(0,0,0) inset;
  transition: box-shadow 3s;
}

.site-header .genesis-nav-menu .menu-item a:hover {
  box-shadow: 3px 3px 14px rgb(0,0,0), 0 0 0 rgba(0,0,0, 0) inset;
}
于 2015-03-28T19:22:40.390 に答える
-1

トランジションを使用: すべて; box-shadow の代わりに、問題を解決する必要があります

于 2015-03-28T19:20:22.057 に答える