クラス.stickyNoteに属するdivがあり、そのdiv内に<h1>、stickyNoteのタイトルとしての<p>タグと、stickynoteのコンテンツとしてのタグがあります。ちょうどそのように：<div class="stickyNote">
<h1>Drag Me</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum..</p>
</div>-->
stickyNoteクラスは、このCSSを使用して、ホバーするともう少し前面に表示されるようにスタイル設定されています。
.stickyNote :hover,.stickyNote :focus{
-moz-box-shadow:10px 10px 7px rgba(0,0,0,.7);
-webkit-box-shadow: 10px 10px 7px rgba(0,0,0,.7);
box-shadow:10px 10px 7px rgba(0,0,0,.7);
-webkit-transform: scale(1.25);
-moz-transform: scale(1.25);
-o-transform: scale(1.25);
position:relative;
z-index:5;
}
ただし、stickyNote divにカーソルを合わせる<h1>と、セクションと<p>セクションは常に別々にフォアグラウンドになります。つまり、<h1>カーソルを合わせるとフォアグラウンドになり、カーソルを<p>合わせるとフォアグラウンドになりますが、stickyNote全体は表示されません。 。私は何が欠けていますか？全体としてdiv。