0
interfereing採取以下codepen:https://codepen.io/anon/pen/Xgqjyq引導進口與<figure>放置
的數字
h2 {
\t color: #111;
\t font-family: 'Open Sans', sans-serif;
\t font-size: 20px;
\t font-weight: bold;
\t text-align: center;
}
.content {
margin-left: 5px;
margin-right: 5px;
text-align: center;
line-height: .75em;
}
.image-cropper {
width: 20%;
height: 5%;
position: relative;
border: 0px solid white;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 500px;
overflow:hidden;
\t margin:0 auto;
}
.info {
\t color: black;
}
.interest {
\t width:4em;
\t height:4em;
\t padding-bottom: .2em; \t
}
figure {
display: inline-block;
\t width: 8em;
}
figcaption {
\t font-family: 'Helvetica Neue', sans-serif;
\t font-size: 17px;
\t font-weight: bold;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<body>
\t \t <nav class="navbar navbar-default">
\t \t <div class="container-fluid">
\t \t \t <div class="navbar-header">
\t \t \t <a class="navbar-brand" href="#">
\t \t \t \t header
\t \t \t </a>
\t \t \t </div>
\t \t </div>
</nav>
\t \t <div class="content">
\t \t \t <div>
\t \t \t \t \t <h2>title</h2>
\t \t \t \t \t <figure>
\t \t \t \t \t \t <img class="interest" src="" alt="pic"/>
\t \t \t \t \t \t <figcaption>caption</figcaption>
\t \t \t \t \t </figure>
\t \t \t \t \t <figure>
\t \t \t \t \t \t <img class="interest" src="" alt="pic"/> \t
\t \t \t \t \t \t <figcaption>caption</figcaption>
\t \t \t \t \t </figure>
\t \t \t </div>
\t \t </div>
\t </body>
兩者都留在自己的線對齊。但是,如果您刪除HTML頂部的引導樣式鏈接,則它們會像我想要的那樣位於一行中間。
但我需要引導程序的標題格式。
有什麼辦法解決這個問題嗎?我試着用nav元素下載一個自定義的Bootstrap,但是這並沒有解決問題。