我試圖讓洗掉按鈕只出現在用戶懸停在它上面的那一行。我使用了CSS,但我想找到一種使用Bootstrap的方法。以下是代碼片段。
<!DOCTYPE html>
<html>
<head>
< meta name="viewport" content="width=device-width, initial-scale=1">
<link rel=" stylesheet" href="https://cdnjs. cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></head>/span>
<body>
<div class="container-fluid">
<form id="search_form">
< div id="search_row" class="search-details">/span>
<div class="search_data"/span>>
< section id="form_input_section" class="d-flex-column">
</section>/span>
< section id="form_add_button_row" class="d-flex flex-row flex-fill justify-content-around align-items-center form-group">
< input type="text"/span> class="form- control col-4" id="inlineFormInput" placeholder="Input。 .">
< button type="button" id="btn_remove_row" /span> > 洗掉</按鈕>
</section>/span>
</div>
</div>/span>
</form>
</div>/span>
</body>
</html>
uj5u.com熱心網友回復:
所以這里是你的答案,正如我之前在評論中寫下的。你需要一個開始狀態,在你的例子中,這將是你的id #btn_remove_row上的display: none,當你懸停在#search_row上時,你再次瞄準#btn_remove_row的特定id,以機會它的視角。
這里的作業例子。https://www.codeply.com/p/HmGBqPCgnF
或者按照你的代碼提供
#btn_remove_row{display: none}.
#search_row:hover #btn_remove_row{display: block}.
我建議把它做成一個表,并使用類,而不是ID。這將給你更多的控制權,并幫助你正確地對齊一切。
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/331842.html
標籤:
