ホームページ >ウェブフロントエンド >htmlチュートリアル >html は複数のクラスをロードしますが、1 つだけをロードするクラスもあれば、両方をロードするクラスもあります。なぜですか? _html/css_WEB-ITnose
spe_top Banner_top と spe_top Banner_top どちらか 1 つだけが有効です
header_img spe_img どちらも有効です
HTML コード
<div class="spe_header header" style="height:150px;"> <div class="spe_top banner_top"> <div class="header_menu"> <input type="button" id="banner_open" /> </div> <div class="banner spe_ban"> <div class="banner_x"><input type="button" id="banner_close" /></div> <div class="banner_main speban_ul"> <ul> <li><a href="index.html">HOME</a></li> <li><a href="about.html">ABOUT</a></li> <li><a href="service.html">SERVICE</a></li> <li><a href="gallery.html">GALLERY</a></li> <li><a href="blog.html">BLOG</a></li> <li><a href=""></a>CONTACT</li> </ul> </div> </div> </div> <div class="header_img spe_img"></div></div>
.spe_header{height:150px;}.header{background:#0CC repeat;height:700px;color:white;}.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}.header_img{margin:0 auto;width:70%;height:800px;background:url(../images/banner.jpg) no-repeat;background-size:cover;position:absolute;top:0;left:230px;}.spe_img{height:150px;}.spe_top{height:150px;}/*同样优先级的选择器,相同属性的样式,写在后面的会覆盖前面的,要把这行放到后面*/
そういう意味ではなく、まったく効果のないセレクターがあり、画像を配置することはできませんfirst
spe_top Banner_top と spe_top Banner_top 这两个分别只有一有效
header_img spe_img 两个都有效
.spe_header{height:150px;}.header{background:#0CC repeat;height:700px;color:white;}.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}.header_img{margin:0 auto;width:70%;height:800px;background:url(../images/banner.jpg) no-repeat;background-size:cover;position:absolute;top:0;left:230px;}.spe_img{height:150px;}.spe_top{height:150px;}/*同样优先级的选择器,相同属性的样式,写在后面的会覆盖前面的,要把这行放到后面*/
です
不この意思決定は、選択ツールの根本的な没効果があり、開始不了図
カバーされています。
.spe_top{height:150px;}
最初のものは間違いなく機能しません。あなたが書いた 2 番目のスタイルを見てください。
恥ずかしくて返信できないので、急いで投稿を閉じてください。
皆さん、ありがとうございます。主にコメントに関する問題であり、優先順位があまり明確ではありませんでした。問題は解決されました。