HTML 5開発シリーズの偽要素の真の意味
ぎじげんそ
偽の要素は実は1つの要素で、しかし本当の定義がなくて、しかし消えて効果は実は1つの行内の要素の効果です
::beforeは実は1つの要素の内部で、一番前に1つの行内の要素を追加しました;
表示モードを変更したり、幅を設定したりすると、背景にこの要素の本当の姿が見えます.
例:
偽の要素は実は1つの要素で、しかし本当の定義がなくて、しかし消えて効果は実は1つの行内の要素の効果です
::beforeは実は1つの要素の内部で、一番前に1つの行内の要素を追加しました;
表示モードを変更したり、幅を設定したりすると、背景にこの要素の本当の姿が見えます.
例:
<style type="text/css">
.content{
margin: 200px;
}
span{
width: 100px;
height: 100px;
background-color: red;
display: block;
}
.content:hover::before{
content: "";
width: 100px;
height: 100px;
border: 10px solid yellow;
float: left;
box-sizing: border-box;
}
</style>
<div class="content">
<span/>
</div>
</code></pre>
<p> </p>
</div>
</div>
</div>
</div>