だから私は次のコードを持っています:
{% load static %}
<!DOCTYPE html>
<html>
<head>
<title>Verification Code Email</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<style>
.insta-icon{width:50%; float:right;}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-1 offset-1 border-right"> # This one right here
<img class="insta-icon"src="{% static '/images/instagram_icon.png' %}">
</div>
<div class="col-10"> b</div>
</div>
</div>
<div class="container">
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
</body>
</html>
just を実行border
すると境界線が表示され、border-bottom
orを実行border-top
すると境界線が表示されます。ただし、border-left
またはを使用するborder-right
と、境界線の輪郭が表示されません。
また、insta-nav
div クラスにクラスを追加してスタイルを使用し、 を追加してスタイルをオーバーライドしようとしましborder:1px
たが、境界線が追加されません。
なぜこれらの2つの理由はそうなのでしょうか?? どんな助けでもいただければ幸いです